// Set global variables
var token = 'i7Bdf-TWut7NWy9k9k6FfaGkpfXrGDLgjWEb48Sv64LP6cdXaUjwyw..';
var apiLoc = 'http://api.brightcove.com/services/library';
var json;

// Initialize the script
window.onload = function(){
	// iPhone hack to scroll past location bar
	window.scrollTo(0,1);

	// Load the Home view
	viewHome();
}

// Set display states for navigation tabs
function handleTabs(pActive) {
	// Set all tabs to inactive
	document.getElementById('nav_home_active').style.display = 'none';
	document.getElementById('nav_home_inactive').style.display = 'block';
	document.getElementById('nav_channels_active').style.display = 'none';
	document.getElementById('nav_channels_inactive').style.display = 'block';
	document.getElementById('nav_newest_active').style.display = 'none';
	document.getElementById('nav_newest_inactive').style.display = 'block';
	
	// Set the requested tab as active
	document.getElementById('nav_' + pActive + '_active').style.display = 'block';
	document.getElementById('nav_' + pActive + '_inactive').style.display = 'none';
}

// Make a Brightcove API call
function getData(url){
	// Create a script tag
	var script = document.createElement('script');
	script.setAttribute('src', url);
	script.setAttribute('type', 'text/javascript');
	
	// Remove script after use
	script.onload = function() {
		document.getElementsByTagName('head')[0].removeChild(script);
	};
	
	// Insert script
	document.getElementsByTagName('head')[0].appendChild(script);
}

// Build the Home view
function viewHome() {
	// Set display states
	document.getElementById('content_playlists').style.display = 'none';
	document.getElementById('content_videos').style.display = 'none';
	document.getElementById('content_home').style.display = 'block';
	document.getElementById('load_icon').style.display = 'none';
	
	// Handle tab navigation
	handleTabs('home');
}

// Build the Playlists view
function viewPlaylists(pType) {
	// Show loading icon
	document.getElementById('load_icon').style.display = 'block';
	
	if(pType == 'all') {
		// Load all playlists
		var command = '?command=find_all_playlists&callback=buildPlaylistsAll&media_delivery=http&token=' + token;
	} else {
		// Load newest videos playlist
		var command = '?command=find_all_videos&page_size=5&sort_by=PUBLISH_DATE&sort_order=DESC&callback=buildPlaylistsNew&media_delivery=http&token=' + token;
	}
	
	getData(apiLoc + command);
}

// Build the Videos view
function viewVideos(pId) {
	// Set display states
	document.getElementById('content_home').style.display = 'none';
	document.getElementById('content_playlists').style.display = 'none';
	document.getElementById('content_videos').style.display = 'block';
	
	// Load all videos
	buildVideos(pId);
}

// Construct playlist list
function buildPlaylistsAll(pData) {
	// Store data as global variable
	json = pData;
	
	// Handle non-UDS accounts
	if(json.error) {
		var command = '?command=find_all_playlists&callback=buildPlaylistsAll&token=' + token;
		
		getData(apiLoc + command);
		
		return;
	}
	
	// Set display states
	document.getElementById('content_videos').style.display = 'none';
	document.getElementById('content_home').style.display = 'none';
	document.getElementById('content_playlists').style.display = 'block';
	
	handleTabs('channels');
	
	// Clear any previous content
	document.getElementById('content_playlists').innerHTML = '';
	
	// Create each playlist item
	for(var i = 0; i < json.items.length; i++) {
		document.getElementById('content_playlists').innerHTML += '<div class="item" onclick="viewVideos(' + i + ')"><div class="container"><img src="' + json.items[i].videos[0].thumbnailURL + '" /></div><div class="right"><div>' + json.items[i].name.toUpperCase() + '</div><span>' + json.items[i].videos.length + '</span></div><img src="arrow.png" class="arrow" /><br class="clear" /></div>';
	}
}

// Construct playlist list
function buildPlaylistsNew(pData) {
	// Handle non-UDS accounts
	if(pData.error) {
		var command = '?command=find_all_videos&page_size=5&sort_by=PUBLISH_DATE&sort_order=DESC&callback=buildPlaylistsNew&token=' + token;
		
		getData(apiLoc + command);
		
		return;
	}
	
	// Set display states
	document.getElementById('content_home').style.display = 'none';
	document.getElementById('content_playlists').style.display = 'none';
	document.getElementById('content_videos').style.display = 'block';
	
	handleTabs('newest');
	
	// Store as local variable
	var videos = pData.items;
	
	// Set playlist title
	document.getElementById('content_videos').innerHTML = '<div class="playlistTitle">Newest Videos</div>';
	
	// Create each video item
	for(var i = 0; i < videos.length; i++) {
		document.getElementById('content_videos').innerHTML += '<div class="item" onclick="playVideo(\'' + videos[i].FLVURL + '\')"><div class="container"><img src="' + videos[i].thumbnailURL + '" /></div><div class="right"><div>' + videos[i].name + '</div></div><img src="arrow.png" class="arrow" /><br class="clear" />';
	}
}

// Construct video list
function buildVideos(pId) {
	// Store as local variable
	var videos = json.items[pId].videos;
	
	// Set playlist title
	document.getElementById('content_videos').innerHTML = '<div class="playlistTitle">' + json.items[pId].name + '</div>';
	
	// Create each video item
	for(var i = 0; i < videos.length; i++) {
		document.getElementById('content_videos').innerHTML += '<div class="item" onclick="playVideo(\'' + videos[i].FLVURL + '\')"><div class="container"><img src="' + videos[i].thumbnailURL + '" /></div><div class="right"><div>' + videos[i].name + '</div></div><img src="arrow.png" class="arrow" /><br class="clear" />';
	}
}

// Play a video
function playVideo(pUrl) {
	window.location = pUrl;
}

// Change the layout on orientation change
function updateOrientation(){
	var container = document.getElementById('container');
	
	switch(window.orientation) {
		// Portrait mode
		case 0:
		case 180:
			container.style.minHeight = '313px';
			break;
		// Landscape mode
		case -90:
		case 90:
			container.style.minHeight = '194px';
			break;
	}
}