var pPlayer, pVideo, pContent, pExperience;

function onTemplateLoaded(pPlayer) {
	pPlayer = brightcove.getExperience(pPlayer);
	pVideo = pPlayer.getModule(APIModules.VIDEO_PLAYER);
	pExperience = pPlayer.getModule(APIModules.EXPERIENCE);
	
	pExperience.addEventListener(BCExperienceEvent.TEMPLATE_READY, onTemplateReady);
}

function onTemplateReady() {
	pVideo.addEventListener(BCMediaEvent.COMPLETE, onMediaComplete);
	pVideo.addEventListener(BCMediaEvent.CHANGE, onMediaChange);
}

function onMediaComplete(pEvent) {
	var pId = pEvent.media.id;
	var pFound = false;
	var pNextUp = false;
	
	for(var i = 0; i < PLAYLIST.length; i++) {
		if(pFound) {
			pNextUp = PLAYLIST[i];
			
			changeVideo(pNextUp);
			
			var pOffset = findPos(document.getElementById("playlist_" + pNextUp));
			
			document.getElementById("playlist").scrollTop = pOffset;
			
			// Update the video meta data here
			changeVideoMeta(pNextUp);
			
			return;
		}
		
		if(pId == PLAYLIST[i]) {
			pFound = true;
		}
	}
}

function onMediaChange(pEvent) {
	var pId = pEvent.media.id;
	
	var pParentEl = document.getElementById("playlist");
	var pChildren = pParentEl.getElementsByTagName("div");
	
	for(var i = 0; i < pChildren.length; i++) {
		if(pChildren[i].getAttribute("rel")) {
			pChildren[i].className = "playlist_video";
		}
	}
	
	try {
		var pActiveChild = document.getElementById("playlist_" + pId);
		pActiveChild.className = "playlist_video playlist_active";
	} catch(e) {}
}

function changeVideo(pId) {
	pVideo.loadVideo(pId);
}

function changeVideoMeta(pId) {
	//Find the playlist element with this Id
	var pEl = document.getElementById("playlist_" + pId);
	var videoUrl = $('.playlist_video_url', $(pEl)).html();
	var videoName = $('.playlist_video_name', $(pEl)).html();
	var videoDesc = $('.playlist_video_desc', $(pEl)).html();	
	var videoLinkUrl = $('.playlist_video_linkUrl', $(pEl)).html();
	var videoLinkText = $('.playlist_video_linkText', $(pEl)).html();	
	
	//Update the title and description
	$('#storyTitle', '#player').html(videoName);
	$('#storyDescription', '#player').html(videoDesc + '<br />');
	if (videoLinkUrl !== "") {
		//Update the Take Action button
		$('#takeActionLink').attr('href', videoLinkUrl);
		$('#takeActionLink').html('<span class="ui-button-text">' + videoLinkText.toUpperCase() + '</span>');	
		$('#takeActionLink').removeClass('hidden');
		$('#takeActionLink').show();								
	} else {
		//Hide the button
		$('#takeActionLink').hide();				
	}
	//Update the global AddThis config objects
	var addthis_share = {
		   templates: {
				  twitter: 'Check out this video: "{{title}}", at {{url}} (from @HumaneSociety)'
		   },
		   url: videoUrl,
		   title: videoName,
		   description: videoDesc
	};			
	//Update the AddThis buttons
	var $shareButtons = $('#shareButtons');
	var toolbox = $shareButtons.get(0);
	$shareButtons.html('');
	var services = {facebook: 'Facebook', twitter: 'Twitter', email: 'Email'};			
	for (var s in services) {
		toolbox.innerHTML += '<a class="addthis_button_'+s+'"></a>';
	}
	addthis.toolbox("#shareButtons", addthis_config, addthis_share);	
}

function findPos(pEl) {
	var pTop = 0;
	
	do {
		if(pEl.id == "playlist") {
			return pTop;
		} else {
			pTop = pEl.offsetTop;
		}
	} while (pEl = pEl.parentNode);
}

/*
function findPos(obj) {
	var curleft = curtop = 0;
	
	if (obj.offsetParent) {
		do {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		} while (obj = obj.offsetParent);
		
		return [curleft,curtop];
	}
}
*/
