document.domain = "univision.com";

var cItems = new Array();
var url_vars = getUrlVars();
var vid_selected = url_vars['vid'] ? parseInt(url_vars['vid']) : 0; //Default selected video (beginning with 0)
var page_selected = 0;
var scrollPerPage = 5; //amount of images to scroll by

//carouselItem = object to contain title, description, and path to thumbnail for each video
function carouselItem(title, desc, thumb, url, cid) {
	this.title = title;
	this.desc = desc;
	this.thumb = thumb;
	this.url = url;
	this.cid = cid;
}



/**
 * We use the initCallback callback
 * to assign functionality to the controls
 */
function mycarousel_initCallback(carousel) {
    
    jQuery('#mycarousel-next').bind('click', function() {
        carousel.next();
        return false;
    });

    jQuery('#mycarousel-prev').bind('click', function() {
        carousel.prev();
        return false;
    });
	
	jQuery('#mycarousel-first').bind('click', function() {
        carousel.scroll(1);
        return false;
    });

    jQuery('#mycarousel-last').bind('click', function() {
		carousel.scroll(carousel.size());
		return false;
    });
	

	loadCaption('item' + (vid_selected + 1));
	jQuery("#img" + (vid_selected + 1)).css("opacity", "1");
	jQuery("#img" + (vid_selected + 1)).css("filter", "alpha(opacity=100)");
}

function mycarousel_itemFirstInCallback(carousel, item, idx, state) {
	var totalPages = parseInt(cItems.length / scrollPerPage);
	if (cItems.length % scrollPerPage) { totalPages++; }
    var pagenum = parseInt((idx - 1) / scrollPerPage) + 1;
	document.getElementById('current_video').innerHTML = pagenum;
	if (idx <= 1) { //Showing first page
		jQuery('#mycarousel-first').hide();
		jQuery('#mc_first').hide();
		
	} else {
		jQuery('#mycarousel-first').show();
		jQuery('#mc_first').show();	
	}
	
}
function mycarousel_itemLastInCallback(carousel, item, idx, state) {
    
	if (idx >= carousel.size()) { //Showing first page
		jQuery('#mycarousel-last').css("visibility", "hidden");
		jQuery('#mc_last').css("visibility", "hidden");
	} else {
		jQuery('#mycarousel-last').css("visibility", "");
		jQuery('#mc_last').css("visibility", "");
	}
	
}
function loadCaption(id) {
	var selected = 0;
	for (var i=0; i <= cItems.length; i++) {
		if (id == 'item' + i) {
			selected = i - 1;
			break;
		}
	}
	var title = cItems[selected].title;
	var desc = cItems[selected].desc;
	jQuery('#caption_title').text(title);
	jQuery('#caption_desc').text(desc);
	return selected;
}
function loadThumbs(playlistID) {
	if (!playlistID) {playlistID = playlistChannelID;}
	var token = '';
	jQuery.ajax({
	  /*url: "/contentroot/uol/10portada/content/jhtml/ajax/NOMETA_ajax_conduit.jhtml?url=" + php_urlencode("http://www.univision.com/content/flashvideo/token.jhtml"),*/
	  url: "/content/flashvideo/token.jhtml",
	  cache: false,
	  success: function(html){
		token = html.replace(/^\s+|\s+$/g,"");
		/*var url = php_urlencode("http://www.univision.com/content/flashvideo/playlist.jhtml?chid=" + playlistID + "&amount=20&token=" + token);*/
		jQuery.ajax({
			/*url: "/contentroot/uol/10portada/content/jhtml/ajax/NOMETA_ajax_conduit.jhtml?asXML=1&url=" + url,*/
			url: "/content/flashvideo/playlist.jhtml?chid=" + playlistID + "&amount=20&token=" + token,
			cache: false,
			dataType: "xml",
			success: function(xml, status) {
				cItems.length = 0;
				jQuery('item', xml).each(function(i) {
					var obj = jQuery(this);							  
					var cid = obj.attr("content-id") ? obj.attr("content-id") : '';
					var image = obj.attr("image") ? obj.attr("image") : '';
					var title = obj.attr("title") ? obj.attr("title") : '';
					var summary = obj.attr("summary") ? obj.attr("summary") : '';
					var url = "/content/videoplayer.jhtml?cid=" + cid;
					cItems.push(new carouselItem(title, summary, image, url, cid));
				});
				
				var totalPages = parseInt(cItems.length / scrollPerPage);
				if (cItems.length % scrollPerPage) { totalPages++; }
				jQuery('#total_pages').html(totalPages);
				var html_thumbs = '';
				for (var i = 1; i <= cItems.length; i++) {
					lastSlash = cItems[i-1].thumb.lastIndexOf("/");
					filename = cItems[i-1].thumb.substr(lastSlash + 1, cItems[i-1].thumb.length - (lastSlash + 1));
					path = cItems[i-1].thumb.substr(0, lastSlash);
					html_thumbs += '<li class="carousel-item" id="item' + i + '"><a href="' + cItems[i-1].url + '"><img id="img' + i + '" class="cImage" src="http://u.univision.com' + path + "/new_132x99_" + filename + '" border="0" /></a></li>';
					//html_thumbs += '<li class="carousel-item" id="item' + i + '"><a href="' + cItems[i-1].url + '"><img id="img' + i + '" class="cImage" src="http://u.univision.com' + cItems[i-1].thumb + '" border="0" /></a></li>';
				}
				var remainder = cItems.length % scrollPerPage;
				if (remainder > 0) {
					var extraEmpty = scrollPerPage - (cItems.length % scrollPerPage);
					for (var a= 1; a <= extraEmpty; a++) {
						html_thumbs += '<li class="carousel-item" id="item' + i + '" style="visibility: hidden"></li>';
						i++;
					}
				}
				page_selected = parseInt(vid_selected / scrollPerPage) * scrollPerPage + 1;
//				jQuery("#mycarousel").html('');
				jQuery("#mycarousel").html(html_thumbs);
				jQuery("#mycarousel").jcarousel({
					scroll: scrollPerPage,
					start: page_selected,
					initCallback: mycarousel_initCallback,
					buttonNextHTML: '',
					buttonPrevHTML: '',
					itemFirstInCallback:  mycarousel_itemFirstInCallback,
					itemLastInCallback: mycarousel_itemLastInCallback
				});
				jQuery("li.carousel-item").mouseover(function() {
					jQuery("img", this).css("opacity", "1");
					jQuery("img", this).css("filter", "alpha(opacity=100)");
					loadCaption(this.id);
				}).mouseout(function() {
					jQuery("img", this).css("opacity", "0.5");
					jQuery("img", this).css("filter", "alpha(opacity=50)");
					loadCaption('item' + (vid_selected + 1));
					jQuery("#img" + (vid_selected + 1)).css("opacity", "1");
					jQuery("#img" + (vid_selected + 1)).css("filter", "alpha(opacity=100)");
					
			
				}).click(function() {
					jQuery("img.cImage").css("opacity", "0.5");
					jQuery("img.cImage").css("filter", "alpha(opacity=50)");
					vid_selected = loadCaption(this.id);
					jQuery("img", this).css("opacity", "1");
					jQuery("img", this).css("filter", "alpha(opacity=100)");
				});
				/*return html_thumbs;*/
				
			}
		});
	  }
	});
}

function getAdtagSrc()
{
	adtagSrc = adtagSrc.replace( new RegExp( "&TILE=[^&]+" ), "" );
	return adtagSrc;
} // function getAdtagSrc()

function renderAds(syncParam)
{
	var jsSrc300x250 = adtagSrc;
	var jsSrc2x3 = jsSrc300x250.replace( "SIZE=300x250", "SIZE=2x3" ).replace( "cid=300250x", "cid=23x" );
	var tileRegExp = new RegExp( "&TILE=[^&]+" );

	if( syncParam != "" )
	{
		jsSrc2x3    = jsSrc2x3.replace(    "SIZE=2x3",    "SIZE=2x3&SYNC="    + syncParam );
		jsSrc300x250 = jsSrc300x250.replace( "SIZE=300x250", "SIZE=300x250&SYNC=" + syncParam );
	} // endif

	jsSrc2x3    = jsSrc2x3.replace(    "js.ng/Params.richmedia=yes&", "html.ng/" ).replace( tileRegExp, "" );
	jsSrc300x250 = jsSrc300x250.replace( "js.ng/Params.richmedia=yes&", "html.ng/" ).replace( tileRegExp, "" );

	document.getElementById( "adtagiframe" ).src = jsSrc300x250;
	document.getElementById( "sponsorAd"   ).src = jsSrc2x3;
} // function renderAds()

function php_urlencode (str) {
	str = escape(str);
	return str.replace(/[*+\/@]|%20|;|%00/g,
		function (s) {
			switch (s) {
				case "*": s = "%2A"; break;
				case "+": s = "%2B"; break;
				case "/": s = "%2F"; break;
				case "@": s = "%40"; break;
				case "%20": s = "+"; break;
				case ";": s = "%3B"; break;
				case "%00": s = ""; break;
			}
		return s;
		}
	);
}
function getUrlVars() {
	var vars = [], hash;
	var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
	for(var i = 0; i < hashes.length; i++) {
		hash = hashes[i].split('=');
		vars.push(hash[0]);
		vars[hash[0]] = hash[1];
	}
	return vars;
}


jQuery(document).ready(function() {
	jQuery('#main_menu li').each(function(){
		jQuery(this).hover(function () {
			jQuery(this).toggleClass("sfhover");
		}, function () {
			jQuery(this).toggleClass("sfhover");
		}); 
	});
});

