/* ------------------------------------------------------------------------
	For the feature items navigator
------------------------------------------------------------------------- */

(function($) {
	$.fn.feature = function(settings) {
		settings = jQuery.extend({animationSpeed: 'fast'}, settings);

		// If the scrollable content is too big, init the scroll
		if($('.mp_scroll-pane').height() > 90){
			$('.mp_scroll-pane').height(90).css('marginRight',-20).jScrollPane({scrollbarWidth:14,scrollBarMargin:0});
		}

		var currentIndex = 0;
		var $nav = $('#mp_player .mp_nav');
		var $content = $('#mp_player .mp_content');
		var $paging = $nav.find('.mp_pages ul');
		var $mp_player = $('#mp_player');

		// Set the paging
		toInject = '';
		pagingWidth = 0;
		for (var i=0, len = featureJson['items'].length; i < len; i++) {
			toInject += '<li><a href="#">'+(i+1)+'</a></li>';
			pagingWidth += 19;
		};

		$paging.html(toInject).find('li:first').addClass('selected');

		// Set the width and position it
		$paging.parent().width(pagingWidth + 32);
		$nav.find('ul:first').css('marginLeft',($nav.width()/2) - $paging.width());

		// Bind the nav function
		$paging.find('a').each(function(i){
			$(this).click(function(){
				_changeFeature(i,this);
				return false;
			});
		});

		$nav.parent().find('.b_next').click(function(){
			if($(this).hasClass('disabled')) return false;
			currentIndex++;
			_changeFeature(currentIndex);
			return false;
		});

		$nav.parent().find('.b_prev').click(function(){
			if($(this).hasClass('disabled')) return false;
			currentIndex--;
			_changeFeature(currentIndex);
			return false;
		});

		//Embed lightbox
		$mp_player.find('.embed').one('click',function(){
			$(this).prettyPhoto({allowresize: false, callback: function(){
				$(this).find('textarea').die();
			}});
			$(this).bind("click", function(){
				$(this).find('textarea').live("click", function(){
					$(this).select();
				});
			});
			$(this).trigger('click');
			return false;
		});

		//Share lightbox
		$mp_player.find('.share').one('click',function(){

			//CUSTOM event!
			$(".ppt").live('click', function(){
				$(".mp_share").find('#mp_url-input').attr('value',window.location);
			});

			$(this).prettyPhoto({allowresize: false, callback: function(){
				$(this).find('input').die();
				$(".ppt").die();
			}});

			$(this).bind("click", function(){
				$(this).find('input').live("click", function(){
					$(this).select();
				});
			});
			$(this).trigger('click');
			return false;
		});

		//non stop mode
		$mp_player.find('.readingMode-one').click(function(){
			$(this).attr({"class":"readingMode-oneOn"});
			$mp_player.find('.readingMode-twoOn').attr({"class":"readingMode-two"});
			$mp_player.find('.readingMode-two').click(function(){
				$(this).attr({"class":"readingMode-twoOn"});
				$mp_player.find('.readingMode-oneOn').attr({"class":"readingMode-one"});
				$.post("/com_inc/setContinuousMode.jsp",{mode:"0"},function(){_changeFeature(currentIndex);});
			});
			$.post("/com_inc/setContinuousMode.jsp",{mode:"1"},function(){_changeFeature(currentIndex);});
		});


		$mp_player.find('.readingMode-two').click(function(){			
			$(this).attr({"class":"readingMode-twoOn"});
			$mp_player.find('.readingMode-oneOn').attr({"class":"readingMode-one"});
			$mp_player.find('.readingMode-one').click(function(){
				$(this).attr({"class":"readingMode-oneOn"});
				$mp_player.find('.readingMode-twoOn').attr({"class":"readingMode-two"});
				$.post("/com_inc/setContinuousMode.jsp",{mode:"1"},function(){_changeFeature(currentIndex);});
			});
			$.post("/com_inc/setContinuousMode.jsp",{mode:"0"},function(){_changeFeature(currentIndex);});
		});

		_changeFeature(0); //add the first one
		_bindFunctions();
		$content.show();

		function _changeFeature(index){
			currentIndex = index;			
			$.getJSON("/com_inc/getContinuousMode.jsp",function(data){				
				loadplayer(featureJson['items'][currentIndex]['videoFirstFrame'],featureJson['items'][currentIndex]['videoId'],featureJson['items'][currentIndex]['trackAtSecond'],featureJson['items'][currentIndex]['adTag'],featureJson['items'][currentIndex]['geoblock'],data.continuousMode);
			});

			// Select the correct nav item
			$paging.find('.selected').removeClass('selected').parent().find('li:eq('+index+')').addClass('selected');

			if(index == 0){
				$nav.parent().find('.disabled').removeClass('disabled');
				$nav.parent().find('.b_prev').addClass('disabled');
			}else if(index==featureJson['items'].length -1){
				$nav.parent().find('.disabled').removeClass('disabled');
				$nav.parent().find('.b_next').addClass('disabled');
			}else{
				$nav.parent().find('.disabled').removeClass('disabled');
			}

			// Fade the content out
			$mp_player.find('.mp_details').remove();
			$mp_player.find('.mp_content').fadeOut(settings.animationSpeed, function(){ $(this).fadeIn() });

			$('#mp_flash-player').fadeOut(settings.animationSpeed, function(){

				// Replace the content
				if($('#mp_player .jScrollPaneContainer').size() > 0){
					//if scroll pane is active and we don't need it for the new block, we must remove it.
					$('#mp_player .jScrollPaneContainer').remove();
					$('#mp_player .mp_content').prepend('<div class="mp_scroll-pane"><h1></h1><h2><span></span> <a href="#" title="Détails"><img src="/media/images/all/buttons/b_inline_plus.gif" alt="" /></a></h2></div>')
					_bindFunctions();
				}
				$mp_player.find('h1').html('<a href="'+featureJson['items'][index]['videoUrl']+'">'+featureJson['items'][index]['text_title']+'</a>');
				$mp_player.find('h2 span').html('<a href="'+featureJson['items'][index]['videoParentUrl']+'">'+featureJson['items'][index]['text_artist']+'</a>');
				$mp_player.find('.mp_appreciation strong').html(featureJson['items'][index]['text_rating'] + '%');

				$mp_player.find('.embed').attr('href','/ajax/embed.jsp?ajax=true&width=600&height=280&videoId=' + featureJson['items'][index]['videoId']);
				$mp_player.find('.playlist').attr('name', featureJson['items'][index]['videoId']).addToPlaylist();

				// Build the tags
				//<li class="plus"><a href="#" title="Détails"><img src="/media/images/all/buttons/b_inline_plus.gif" alt="" /></a></li>
				var tagsCount = featureJson['items'][index]['text_tags'].length;
				if(tagsCount > 0){
					toInject = '<li class="cufon">Tags:</li>';
					for (var i=tagsCount-1; i >= 0; i--) {
						toInject += '<li><a href="'+featureJson['items'][index]['text_tags'][i]['url']+'"><strong>'+featureJson['items'][index]['text_tags'][i]['tag']+'</strong></a></li>';
						pagingWidth += 19;
					};
					var $firstTags = $mp_player.find('ul.mp_tags:first');
					$firstTags.html(toInject);
					if($firstTags.css('height','auto').height() > 35) $firstTags.css('height',35);
				}
				else{
					$mp_player.find('.mp_tags-container:first').hide();
				}

				//update rating style (up, down..)
				rateUpdateStyle(featureJson['items'][index]['rating']);

				//Build the feedbacks
				//toInject = '<li class="tooltipLink"><a href="#mp_quenpensestu-label" style="text-transform: none;">Qu\'en penses-tu?</a>
				//:<span id="mp_quenpensestu-label" style="display:none;"></span></li>';
				toInject = '<li class="quenpensestu">Qu\'en penses-tu?:</li>';
				var loopCount = featureJson['items'][index]['text_feedback'].length;
				//toInject += '<li class="plus"><a href="#" title="Détails"><img src="/media/images/all/buttons/b_inline_plus_gray.gif" alt="" /></a></li>';
				for (var i=0; i <loopCount; i++) {
					toInject += '<li><a href="#" id="' + featureJson['items'][index]['text_feedback'][i]['id'] + '"><strong>'+featureJson['items'][index]['text_feedback'][i]['tag']+'</strong></a></li>';
					pagingWidth += 19;
				};
				$mp_player.find('ul.mp_tags:last').html(toInject);

				/* mouse over plus button : expand */
				var $quenpensestu = $mp_player.find('.mp_tags-container:last ul');

				$quenpensestu.append("<li class='last'><div class='left'></div><div class='middle'></div><div class='right'></div></li>");
				$quenpensestu.find('li.plus a').bind('mouseover click', function(){
					$quenpensestu.addClass('on').find('li.last').css({'display':'block'});
					return false;
				});

				$quenpensestu.mouseleave(function(){
					$quenpensestu.removeClass("on").find('li.last').css({'display':'none'});
				});

				// Cufonize the fonts
				Cufon.replace('#mp_player h1, #mp_player h2 span', { fontFamily: 'Arial Rounded MT Bold' });

				// Check the scroll
				if($('.mp_scroll-pane').height() > 76){
					$('.mp_scroll-pane').height(76).jScrollPane({scrollbarWidth:14,scrollBarMargin:0});
				}

				$(this).show();
			});
		};

		function _bindFunctions(){
			//detail btn
			$mp_player.find('h2 a:last').click(function(){						
				return _showDetails();
			});

			//rating
			$.getJSON("/uncachable/amIlogged.jsp?frompage=" + window.location,function(data){	
				if(data.logged){
					var id = featureJson['items'][currentIndex]['id'];
					$mp_player.find('.mp_vote_up').click(function(){
						return rateatom(1, featureJson['items'][currentIndex]['videoId']);
					});
					$mp_player.find('.mp_vote_down').click(function(){
						return rateatom(2, featureJson['items'][currentIndex]['videoId']);
					});
				}
				else{
					$mp_player.find('.mp_vote a').needLogin();
				}
			});

			//feedback tags
			$.getJSON("/uncachable/amIlogged.jsp?frompage=" + window.location,function(data){	
				if(data.logged){
					$mp_player.find('ul.mp_tags:last li[class!=plus] a[class!=hover]').live('click', function(){
						return feedbackatom(0, $(this).attr('id'),featureJson['items'][currentIndex]['videoId']);
					});
				}
				else{
					$mp_player.find('ul.mp_tags:last li[class!=plus][class!=tooltipLink] a').needLogin({live: true});
				}
			});
			$mp_player.find('ul.mp_tags:last li a[class=hover]').click(function(){ return false; });//disables <a>'s native behaviour
		};

		function _showDetails(){
			// Fade the content out
			toInject = "";
			$mp_player.find('.mp_content').fadeOut(settings.animationSpeed,function(){

				

				var tempVue =         (featureJson['items'][currentIndex]['text_details'][0]['text_views']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_views']:"N/A";
				var tempAlbum =       (featureJson['items'][currentIndex]['text_details'][0]['text_albums']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_albums']:"N/A";
				var tempEtiquette =   (featureJson['items'][currentIndex]['text_details'][0]['text_label']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_label']:"N/A";
				var tempAuthor =      (featureJson['items'][currentIndex]['text_details'][0]['text_author']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_author']:"N/A";
				var tempCompositeur = (featureJson['items'][currentIndex]['text_details'][0]['text_compositor']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_compositor']:"N/A";
				var tempRealisateur = (featureJson['items'][currentIndex]['text_details'][0]['text_realisator']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_realisator']:"N/A";
				var tempDate =        (featureJson['items'][currentIndex]['text_details'][0]['text_publish_date']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_publish_date']:"N/A";
				var tempAnnee =       (featureJson['items'][currentIndex]['text_details'][0]['text_production_year']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_production_year']:"N/A";
				var tempLangue =      (featureJson['items'][currentIndex]['text_details'][0]['text_language']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_language']:"N/A";
				var tempPays =        (featureJson['items'][currentIndex]['text_details'][0]['text_country']!="")?featureJson['items'][currentIndex]['text_details'][0]['text_country']:"N/A";

				// Build the needed markup
				toInject += "<div class='mp_scroll-pane'>";
				toInject += "<p>Vidéoclip</p>";
				toInject += "<h1><span>"+featureJson['items'][currentIndex]['text_title']+"</span></h1>";
				toInject += "<h2>"+featureJson['items'][currentIndex]['text_artist']+"<a href='#'><img src='/media/images/all/buttons/b_inline_minus.gif' alt='' /></a></h2>";
				toInject += "<div class='mp_hr'></div>";
				toInject += "<ul class='details'>";
				/*toInject += "<li><span>Vues:</span> "+tempVue+"</li>";*/
				toInject += "<li><span>Album:</span> "+tempAlbum+"</li>";
				toInject += "<li><span>Étiquette:</span> "+tempEtiquette+"</li>";
				/*toInject += "<li><span>Auteur:</span> "+tempAuthor+"</li>";*/
				toInject += "<li><span>Compositeur:</span> "+tempCompositeur+"</li>";
				toInject += "<li><span>Réalisateur:</span> "+tempRealisateur+"</li>";
				toInject += "<li><span>Date de publication:</span> "+tempDate+"</li>";
				/*toInject += "<li><span>Style musical:</span> "+featureJson['items'][currentIndex]['text_details'][0]['text_style']+"</li>";*/
				/*toInject += "<li><span>ISRC:</span> "+featureJson['items'][currentIndex]['text_details'][0]['text_isrc']+"</li>";*/
				toInject += "<li><span>Année de production:</span> "+tempAnnee+"</li>";
				toInject += "<li><span>Langue:</span> "+tempLangue+"</li>";
				toInject += "<li><span>Pays:</span> "+tempPays+"</li>";
				toInject += "</ul>";
				toInject += "</div>";
				$mp_player.find('.mp_content-container').append('<div class="mp_content mp_details"></div>');
				$mp_player.find('.mp_details').html(toInject);

				// Cufonize the fonts
				Cufon.replace('#mp_player .mp_details h1 span, #mp_player .mp_details h2', { fontFamily: 'Arial Rounded MT Bold' });

				// Bind the function
				$mp_player.find('.mp_details h2 a').click(function(){
					$mp_player.find('.mp_details').fadeOut(function(){
						$(this).remove();
						$mp_player.find('.mp_content').fadeIn();
					});
					return false;
				});

				$mp_player.find('.mp_details').fadeIn();

				if($('.mp_details .mp_scroll-pane').height() > 325){
					$('.mp_details .mp_scroll-pane').height(325).css('marginRight',-20).jScrollPane({scrollbarWidth:14,scrollBarMargin:0,dragMaxHeight:150});
				}

			});

			return false;
		};
	}
})(jQuery);
