/** 
 * @projectDescription Listagem de vídeos do UOL Mais via API. Depende de video-lib.js e markup preparado.
 *
 * @author  Iraê Carvalho  (irae@irae.por.br / aut_icarvalho@uolinc.com)
 * @version 1.0 RC1
 * @since   Primeira versão do script
 * @since   Chama a API do UOL Mais, escreve o HTML e adiciona eventos para exibição e funcionamento da lista de vídeos
 */
 
/////////////////////////////////////
//            Init Vars            //
/////////////////////////////////////

/**
 * Objeto em escopo global que descreve a paginação atual .
 * @type {Object}
 * @param {Int} currentPage Página atual
 * @param {Int} totalPages Número total de páginas para esta busca
 * @param {Int} totalItems Número total de mídias nessa busca
 * @param {Int} pageSize Número de resultados da busca a cada páginana 
 * @param {Int} previousPage Número da página anterioror ou null se buscou a primeira página
 * @param {Int} nextPage Número da próxima página ou null quando se buscou a última página
 * @param {String} sort Ordenação da busca atual
 */
var paging = {
	currentPage: _GET('currentPage') || 1,
	totalPages: 1,
	totalItems: 0,
	pageSize: _GET('itemsPerPage') || 12, // NUNCA deve ser diferente de 6 ou 12
	previousPage: null,
	nextPage: null,
	sort: _GET('sort') || "mostRecent"
};
/**
 * Objeto em escopo global que complementa a paginação em buscas por palavra-chave
 * @type {Object}
 * @param {Int} start Número de itens a pular na busca usado para paginar.
 * @param {Int} num Número total de mídias por página para esta busca
 */
var search = {
	start : _GET('start') || 1,
	num : _GET('num') || paging.pageSize
};

/////////////////////////////////////
//     General functionality       //
/////////////////////////////////////


/**
 * Inicia a listagem de vídeos e faz a primeira chamada à API do UOL Mais
 * @type {Function}
 * @return {null}
 */
initMediaList = function () { var $ = jQuery;
	window.MARKUP.defaultWrapperContentHtml = $('#mediawrapper').html();
	$('#mediasearch [name="q"]').val(!_GET('q')?'':_GET('q'));
	if(_GET('q')) {
		getMediasBySearch(_GET('q'), 'drawMediaList');
	} else {
		getMediasByMultipleTags(list_tags, 'drawMediaList');
	}
	seUolMaisMorrer = setTimeout(showCachedMediaList, 5000); // Teimeout de 5 segundos sugerido pelo UOL Mais
};

/**
 * Disparada caso o UOL Mais não responda no intervalo estipulado.
 * @type {Function}
 * @return {null}
 */
showCachedMediaList = function(){ var $ = jQuery;
	console.info('morreu o uolmais ou erro indefinido na chamada: se estiver no index, mostrando cache');
	drawMediaList = function(){void(null);};
	if(document.location.href == medialistURL || document.location.href.indexOf('frame_assistir_outros.jhtm') != -1) {
		$('.cachedContent').removeClass("hidden");
		$('#corpo .showOnlyOnLoading').addClass('hidden');
	}
}

/**
 * Corrige o objeto global 'paging' em casos de API irregular
 * @type {Function}
 * @return {null}
 */
fixUnstandardPaging = function () {
	paging.totalItems = paging.totalItems || paging.totalResults;
	paging.previousPage = (paging.previousPage<1)?null:paging.previousPage;
	paging.nextPage = (paging.nextPage>paging.totalPages)?null:paging.nextPage;
};

/**
 * Chamada no callback da API do UOL Mais para renderizar o HTML e adicionar eventos de uma listagem de vídeos.
 * @type {Function}
 * @param {Object} data Objeto do UOL Mais contendo todos os resultados dessa página de vídeos
 * @return {null}
 */
drawMediaList = function(data){	var $ = jQuery;
	// limpa a proteção contra timeout
	clearTimeout(seUolMaisMorrer);
	// guarda a lista em cache
	window.cachedMediaList = data;
	// se existir função adicional de init: dispara
	if (typeof window.drawMediaListInit == 'function') window.drawMediaListInit();
	// verifica se houve retorno válido
	if(!data.length) {
		// não teve: mostra mensagem de erro
		if($('#mediaList td').length) {
			$('#mediaList td:first').html(MARKUP.messageNoResult());
		} else {
			$('#mediaList').html(MARKUP.messageNoResult());
		}
	} else {
		// teve: limpa o markup para entrar com novo markup limpo e sem duplicatas
		if($('#mediaList tbody').length) {
			$('#mediaList tbody').empty();
		} else {
			$('#mediaList').empty();
		}
		$('#results > h2').addClass('hidden');
		$('.showOnlyOnLoading, .cachedContent').addClass('hidden');
		$('#mediaList').parents('div:first').find('.media-nav').remove();
	}
	if(typeof startTabs == 'function') startTabs();
	// atualiza o objeto local de paginação baseado no retorno
	if(typeof(UOLData.videosByMultipleTagsPaging) =='function') paging = UOLData.videosByMultipleTagsPaging();
	if(typeof(UOLData.videosBySearchPaging) =='function') paging = UOLData.videosBySearchPaging();
	if(typeof(UOLData.videosPublishedVideosPaging) =='function') paging = UOLData.videosPublishedVideosPaging();
	fixUnstandardPaging();
	// escreve título
	$('#results h2').html(MARKUP.listTitle.apply(paging)).removeClass('hidden');
	// escreve paginação
	var paginghtml = MARKUP.paging.apply(paging);
	$('#mediaList').before(paginghtml);
	if(data.length > 3) $('#mediaList').after(paginghtml);
	$('a.switchToList').click(switchToList);
	$('a.switchToGalery').click(switchToGalery);
	// escreve resultados
	if(typeof MARKUP.mediaItem != 'function') {MARKUP.mediaItem = MARKUP.defaultMediaItem;}
	for(var i=0;i<data.length;i++) {
		data[i].publishedAt = data[i].publishedAt || '9999-01-01 00:00:00'; // busca despadronizada
		$(MARKUP.mediaListLoopSelector).append(MARKUP.mediaItem.call(data[i],i+1));
	}
	// se existir callback: dispara
	if (typeof window.drawMediaListCallback == 'function') triggerMediaListCallback();
};

triggerMediaListCallback = function() {
	if(jQuery('#mediaList').height() > 10) {
		window.drawMediaListCallback();
	} else {
		setTimeout(triggerMediaListCallback,100);
	}
}

/**
 * Reescreve os endereços dos links das tabs de uma listagem de vídeo baseando-se no query string
 * @type {Function}
 * @return {null}
 */
// tabs (chamados no markup)
startTabs = function () { var $ = jQuery;
	var loc = document.location.search.toString();
	if(_GET('q')!=false) {
		$('#results .tabs li').not(':first').remove();
	}
	$('#results .tabs li').each(function() {
		//console.debug(getLink('tab',this.className));
		$('a',this).attr('href', getLink('tab',this.className).replace('&amp;', '&'));
		if(loc.match(this.className)){
			$('#results .tabs .'+this.className).addClass('active');
		}
	});
	if($('#results .tabs .active').size() == 0) {
		$('#results .tabs li:first').addClass('active');
	}
	$('#results .tabs').removeClass('hidden');
};

/////////////////////////////////////
// on Document Load call init funcion
/////////////////////////////////////

jQuery(initMediaList);

/////////////////////////////////////
// isolated markup for code cleaness
/////////////////////////////////////

/**
 * Constroe HTML de título para uma lista de vídeos baseado no objeto "paging" global
 * @type {Function}
 * @return {String} HTML com descrição dos resultados da listagem atual
 */
MARKUP.listTitle = function() {
	var messageNoResult = "Nenhum vídeo foi encontrado."; 
	// require object 'this' to be the paging info
	if(_GET('q')) {
		var html = 'A busca <strong>"'+_GET('q')+'"</strong> '+((this.totalItems==0)?"não":'')+' teve<strong> '+((this.totalItems>0)?this.totalItems:'')+'</strong> resultado'+((this.totalItems!=1)?'s':'')+'.';
	} else if (_GET('tagName')) {
		var html = '<strong>'+((this.totalItems>0)?this.totalItems:'Nenhum')+'</strong> vídeo'+((this.totalItems>1)?'s':'')+' com a tag <strong>'+_GET('tagName')+'</strong>.'
	} else {
		var html = '<strong>'+((this.totalItems>0)?this.totalItems:'Nenhum')+'</strong> vídeo'+((this.totalItems>1)?'s':'')+' publicado'+((this.totalItems>1)?'s':'')+'.'
	}
	return html;
};

/**
 * Constroe HTML que será inserido antes de "#mediaList" quando não houver resultados.
 * @type {Function}
 * @return {String} HTML com mensagem de 0 resultados
 */
MARKUP.messageNoResult = function() {
	return "Nenhum resultado foi encontrado para a sua busca.";
};

/**
 * Constroe HTML de uma linha da lista de vídeos. Usar .apply para que o escopo seja um objeto de video UOL Mais
 * @type {Function}
 * @param {Number} index Índice da iteração, iniciado em 1 (um).
 * @return {String} HTML de um vídeo no modo listagem
 */
MARKUP.defaultMediaItem = function(index) { var $ = jQuery;
	// require the object 'this' to be the media info
	var myDate = parseDate(this.publishedAt);
	var firstDate = window.firstDate || new Date(0);
	if(lastDate <  myDate || firstDate >= myDate) {
		var url = medialistURL.replace(/\/[^\/]*$/,'/')+'assistir.jhtm?media='+this.id;
	} else {
		var url = this.id.replace(/.*-([^-]+)$/, "$1");
		url = upsiBaseURL.replace(/\/[^\/]*$/,'/')+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$1/$2/$3/")+url+'.jhtm';
		url = url+'?'+this.id;
	}
	isFirst = (index==1)?'class="first"':'';
	var html = '<tr '+isFirst+'>\
		<td class="imagem"><a href="'+url+'" target="_top"><img src="'+this.thumbnail+'-medium.jpg" /></a></td>\
		<td class="descricao">\
			<dl>\
				<dt class="title"><a href="'+url+'" target="_top"><strong>'+this.title+'</strong> ('+this.duration+')</a></dt>\
				<dd class="description">'+this.description+'</dd>\
				<dd class="tags"><strong>Tags:</strong> ';
					html += MARKUP.tags.apply(this.tags); html += '\
				</dd>\
			</dl>\
		</td>\
		<td class="props">\
			<dl>';
				html += (this.publishedAt&&this.publishedAt!='9999-01-01 00:00:00')?'<dd class="date"><strong>Publicação:</strong> <span class="mediaDate">'+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$3/$2/$1")+'</span></dd>':'';
				html += (this.rating!=null)?'<dd class="rating">Avaliação: <img  class="rateimg" src="http://cr.i.uol.com.br/uolmais/small-'+((Math.round(this.rating*2)/2)).toString().replace('.','')+'.gif" alt="Nota: '+this.rating+'" title="Nota: '+this.rating+'" /></dd>':'';
				html += (this.views!=null)?'<dd class="views">Visitas: <strong>'+this.views+'</strong></dd>':'';
				html += (this.favorites!=null)?'<dd class="views">Favoritos: <strong>'+this.favorites+'</strong></dd>':'';
				html += (this.comments!=null)?'<dd class="comments">Comentários: <strong>'+this.comments+'</strong></dd>':'';
				html += '\
			</dl>\
		</td>\
	</tr>';
	return html;
};

MARKUP.galeryMediaItem = function(index) { var $ = jQuery;
	// require the object 'this' to be the media info
	var myDate = parseDate(this.publishedAt);
	var firstDate = window.firstDate || new Date(0);
	if(lastDate <  myDate || firstDate >= myDate) {
		var url = medialistURL.replace(/\/[^\/]*$/,'/')+'assistir.jhtm?media='+this.id;
	} else {
		var url = this.id.replace(/.*-([^-]+)$/, "$1");
		url = upsiBaseURL.replace(/\/[^\/]*$/,'/')+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$1/$2/$3/")+url+'.jhtm';
		url = url+'?'+this.id;
	}
	var html = ((index-1)%3==0&&index!=1)?'<hr />':'';
	html += '\
		<dl class="item">\
			<dd class="imagem"><a href="'+url+'" target="_top"><img src="'+this.thumbnail+'-large.jpg" /></a></dd>\
			<dt class="title"><a href="'+url+'" target="_top"><strong>'+this.title+'</strong> ('+this.duration+')</a></dt>\
			<dd class="props">\
				<dl>';
					html += (this.publishedAt&&this.publishedAt!='9999-01-01 00:00:00')?'<dd class="date"><strong>Publicação:</strong> <span class="mediaDate">'+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$3/$2/$1")+'</span></dd>':'';
					html += (this.rating!=null)?'<dd class="rating">Avaliação: <img  class="rateimg" src="http://cr.i.uol.com.br/uolmais/small-'+((Math.round(this.rating*2)/2)).toString().replace('.','')+'.gif" alt="Nota: '+this.rating+'" title="Nota: '+this.rating+'" /></dd>':'';
					html += (this.views!=null)?'<dd class="views">Visitas: <strong>'+this.views+'</strong></dd>':'';
					html += (this.favorites!=null)?'<dd class="views">Favoritos: <strong>'+this.favorites+'</strong></dd>':'';
					html += (this.comments!=null)?'<dd class="comments">Comentários: <strong>'+this.comments+'</strong></dd>':'';
					html += '\
				</dl>\
			</dd>\
		</dl>';
	return html;
};

switchToGalery = function() { var $ = jQuery;
	MARKUP.mediaItem = MARKUP.galeryMediaItem;
	var container = $('#mediaList').parents('div:first');
	$('#mediaList').remove();
	container.append('<div id="mediaList" class="clearfix"></div>');
	MARKUP.mediaListLoopSelector =  '#mediaList';
	drawMediaList(window.cachedMediaList);
	return false;
};

switchToList = function() { var $ = jQuery;
	$('#mediawrapper').empty().addClass('hidden').html(MARKUP.defaultWrapperContentHtml);
	$('#mediaList tbody').empty()
	$('#mediawrapper').removeClass('hidden');
	MARKUP.mediaListLoopSelector =  '#mediaList tbody:first';
	MARKUP.mediaItem = MARKUP.defaultMediaItem;
	drawMediaList(window.cachedMediaList);
	return false;
};


MARKUP.resumedMediaItem = function(index) { var $ = jQuery;
	// require the object 'this' to be the media info
	var myDate = parseDate(this.publishedAt);
	var firstDate = window.firstDate || new Date(0);
	if(lastDate <  myDate || firstDate >= myDate) {
		var url = medialistURL.replace(/\/[^\/]*$/,'/')+'assistir.jhtm?media='+this.id;
	} else {
		var url = this.id.replace(/.*-([^-]+)$/, "$1");
		url = upsiBaseURL.replace(/\/[^\/]*$/,'/')+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$1/$2/$3/")+url+'.jhtm';
		url = url+'?'+this.id;
	}
	isFirst = (index==1)?'class="first"':'';
	var html = '<tr '+isFirst+'>\
		<td class="imagem"><a href="'+url+'" target="_top"><img src="'+this.thumbnail+'-medium.jpg" /></a></td>\
		<td class="descricao">\
			<dl>\
				<dd class="date"><span class="mediaDate">'+this.publishedAt.toString().replace(/([0-9]{4})-([0-9]{2})-([0-9]{2}).*/, "$3/$2/$1")+'</span></dd>\
				<dt class="title"><a href="'+url+'" target="_top"><strong>'+this.title+'</strong> ('+this.duration+')</a></dt>\
				<dd class="description">'+this.description+'</dd>\
			</dl>\
		</td>\
	</tr>';
	return html;
};

/**
 * Seletor jQuery (tipo CSS) que diz qual é o elemento que vai receber uma série de outros elementos do MARKUP.mediaItem.
 * @type {String}
 */
if(document.location.href == top.location.href && document.location.href.indexOf('frame_assistir_outros.jhtm')==-1) {
	MARKUP.mediaListLoopSelector =  '#mediaList tbody:first';
	MARKUP.mediaItem = MARKUP.defaultMediaItem;
	window.drawMediaListCallback = function() { var $ = jQuery;
		// calc heights
		var colCenH = ($('#mediawrapper').height()+100)/10;
		console.debug(colCenH);
		var colEsqH = $('#col-esquerda').height()/10;
		console.debug(colEsqH);
		$('#corpo,#col-esquerda,#col-centro').height(((colEsqH>colCenH)?colEsqH:colCenH)+'em');
	}

} else {
	MARKUP.mediaListLoopSelector =  '#mediaList tbody:first';
	MARKUP.mediaItem = MARKUP.resumedMediaItem;
	MARKUP.paging = function() {return '';};
	window.drawMediaListCallback = function() {
		try{ jQuery('#iframeMoreMedias', parent.document).height((jQuery('#corpo').height()+2)+'px'); }catch(e){void(null);}
	}
}