//////////////////
//This file handles the movies lists, playing the right movie,analayzing the SEARCH-ADDRESS
// according to the arrays in movies_list.js  (TabArr, ClipArr)
//
//////////////////


/******************************************************************************
In this section of the file:
creates the tabs-table --> function createTabtable()
creates Divs tables according to TabArr and ClipArr. --> function createDivs(), function createList(num)
Reacting to user's clicks on tab and movie --> function TabChange(num)
Searches the address for "?movie=".... if so, it plays the movie -->function AddressSearch()
Prints a table with Tabs and Clips --> function print_arrays() 
Sending 2 a friends the last movie the user saw --> function send2friend()
*******************************************************************************/
var tabtable_width = TabArr.length * 95; //Defining a variable that holds the table's width I want (95px for each tab = class.width )
var last_a_div = "";// General variable that holds the last list_item played(anchor) - IS USED IN THE START_SHOW FUNCTION
function createTabtable()
//Creates the tab table
{
	table_title = "<div id='tab_list'><table width=100% height=100% align=center border=0 cellpadding=0 cellspacing=2><tr>";
	table_body = "";
	for (i=0;i<TabArr.length;i++)
	{
		var new_id = "td" + i;
		var new_td = "<td class='tab_inactive' id='" + new_id + "' onclick=javascript:TabChange('" + i + "')>" +  TabArr[i].Name + "</td>";
		var table_body = table_body + new_td;
	}
	var space_td_colspan = TabArr.length + 1;
	table_end = "</tr></table></div>";
	document.write(table_title+table_body+table_end);
	// Setting the div's width according to "tabtable_width" 
	var tab_table = document.getElementById("tab_list");
	tab_table.style.width = tabtable_width;
}
function createSpaceRow()
{
	document.write("<table id='space_row' class='white_row'><tr><td></td></tr></table>");
}
function createDivs()
//This function creates the Divs according to TabArr(num of divs) and ClipArr(num of clips in each div) arrays
{
	for (i=0;i<TabArr.length;i++)
	{
	//tab_title = TabArr[i].Title + "<br>";
	div_id = "tab" + i;
	div_start = "<div id='" + div_id + "' class='list_inactive'><table width=100% height=100% align=center border=0 cellpadding=0 cellspacing=0>" ;
	//table_title = "<tr><td colspan=3></td></tr>" ;
	table_body = createList(i);
	table_end = "</table></div>";
	document.write(div_start+table_body+table_end);
	}	
}

function createList(num)
//This function creates the rows in the list table with cam picture element and anchors according to ClipArr array
{
	tbody = "";
	var movienum = 0;
	for (j=0;j<ClipArr.length;j++)
	{
		if (ClipArr[j].tab == TabArr[num].Name)
		{
			var tab_id = "tab" + num;
			//var new_pic_id = tab_id + "campic" + movienum;
			var new_a_id = tab_id + "movie" + movienum;
			var link_id = ClipArr[j].movielink;
			var movie_title = ClipArr[j].details;
			var thumb_loc = "images/thumbs/" + ClipArr[j].thumb;
			var new_tr = "<tr height=74 class='list_item' id='" +new_a_id+"'><td valign=middle width='86px' align=right>";
			var pic_td = "<a href=javascript:start_show('"+ link_id + "','" + new_a_id + "')><img src='"+ thumb_loc + "' width=80 height=60 border=0></a></td>";
			var space_td = "<td width='5px'></td>";
			var movie_td = "<td><p class='clip_title'>" +  movie_title + "</p></td></tr>";
			var tbody = tbody + new_tr + pic_td + space_td + movie_td;
			// <a href=javascript:start_show('"+ link_id + "','" + new_pic_id + "','" + new_a_id + "') id='" + new_a_id + "' class='list_item' valign=middle>
			movienum++;
		}
	}
	tbody = tbody + "<tr><td colspan=2>&nbsp;</td></tr>";
	return tbody;
}
				
function TabChange(num)
{
	//This changes the white tr into pink;
	var space_row_tr = document.getElementById('space_row');
	space_row_tr.style.background = "#ff7fb7";
	//This part switches between the tabs styles according to the user's click
	var current_td = "td" + num;
	for (k=0;k<TabArr.length;k++)
	{
		var td_name = "td" + k;
		var td_obj = document.getElementById(td_name);
		if (td_name == current_td) 	
		{
			td_obj.className = "tab_active";
		}
		else
		{
			td_obj.className = "tab_inactive";
		}
	}
	//This part switches the divs on the screen according to the user's click
	var current_div = "tab" + num;
	for (l=0;l<TabArr.length;l++)
	{
		var div_name = "tab" + l;
		var div_obj = document.getElementById(div_name);
		if (div_name == current_div)
		{
			div_obj.className = "list_active";
		}	
		else
		{
			div_obj.className = "list_inactive";	
		}
	}
}	
function AddressSearch()			
//This function checks if the "search-url" exists... if so it plays the movie and show the correct div.
{
 	//Checking if the "search" exists
	var SearchUrl;
	SearchUrl = self.location.search;
	if (SearchUrl != "")
	//If exists then...
	{
		var SearchSplit = new Array();
		SearchSplit = SearchUrl.split("movie=", 2);	
		var MovieName = SearchSplit[1]; //The movie's name we want to see.
		var MovieNameSplit = new Array();
		MovieNameSplit = MovieName.split("movie",2);
		current_tab = MovieNameSplit[0];  //tab id we want to show -  ex. for tab1movie0 --> tab1
		//alert(current_tab);
		Movie_num = MovieNameSplit[1]; //movie number -   ex. for tab1movie0  -->  0
		//alert(Movie_num);
		//Changing the white space row into pink
		var space_row_tr = document.getElementById('space_row');
		space_row_tr.style.background = "#ff7fb7";		
		//////////////////////////////////////////////
		for (i=0;i<TabArr.length;i++)
		{
			tab_id = "tab" + i;
			if (tab_id == current_tab)
			{
				//alert(tab_id +  "vs." + current_tab);
				Div = document.getElementById(tab_id);
				Div.className = "list_active"; //Shows the list....
				td_id = "td" + i;
				Td = document.getElementById(td_id);
				Td.className = "tab_active" //Changes tab's class name
				var tab_name = TabArr[i].Name; //Tab's name as appears on the arrays
				var Movies_in_tab_count=0; //Counter for movies in the desired tab
				for (ClipCount=0;ClipCount<ClipArr.length;ClipCount++)
				{
					//alert(ClipCount + " , " + ClipArr[ClipCount].tab);					
					if (ClipArr[ClipCount].tab==tab_name)
					{
						//alert(ClipArr[ClipCount].details + "  ,  " + Movies_in_tab_count);
						if (Movies_in_tab_count==Movie_num)
							movie_link = ClipArr[ClipCount].movielink;
						Movies_in_tab_count++;
					}
				}
			}
			else
			{
				Div = document.getElementById(tab_id);
				Div.className = "list_inactive"; //disappears the list.... 
				td_id = "td" + i;
				Td = document.getElementById(td_id);
				Td.className = "tab_inactive"; //Changes tab's class name
			}
		}
		start_show(movie_link ,MovieName);
	}
}

function send2friend()
//This function open the send2friend form. This function sends send2friend form the link to share.
//ex.http://www.girlsense.com/premium/hp/clip/tutorial/index.htm?movie=tab0movie0.
//The function send the link according to the last movie the user saw.
// If the user didn't see any movie(in case he came to the page without any url(only index.htm without ?movie=)) the share link will be INDEX.HTM
{
	var link_part1 = "http://www.girlsense.com/premium/tools/send2friend/index.pl?activity=share&activityLink=http://www.girlsense.com/premium/hp/clip/tutorial/index.htm";
	if (last_a_div == "")
	{
		var link_part2 =""; 	
	}
	else
	{
		var link_part2 = "?movie=" + last_a_div;	
	}
	var full_link = link_part1 + link_part2;
	//alert(full_link);
	window.open(full_link, 'send2friend','toolbar=no, menubar=no, resizable=no, width=400, height=480');
}

function print_arrays()
//This function creates a table with all clip with its "reference" (ex. tab0movie0)
//The page that runs this function will have to determine the classes: headline,miniheadline,titles,rows
{
	var page_header = "<h1><center> Printing the array... </center></h1><br>";
	var page_explaination = "<h4><center> In order to auto-start a movie all you need to do is to open the url:<br> http://www.girlsense.com/premium/hp/clip/tutorial/index.htm?movie=reference</center></h4>";
	var table_header = "<table width=65% height=100% align=center border=2 cellpadding=0 cellspacing=0>";
	document.write(page_header +page_explaination+ table_header);  //writing the table's header
	for (i=0;i<TabArr.length;i++)
	{
		var headlineTr = "<tr><td colspan=3 class=headline>Tab name: " + TabArr[i].Name + "</td></tr>";
		var table_rows = "<tr><td class=titles> Title </td><td class=titles>Href</td><td class=titles>Reference</td>";
		var table_body = "";
		var mone = 0;
		for (j=0;j<ClipArr.length;j++)
		{
			if (ClipArr[j].tab == TabArr[i].Name)
			{
				var new_tr = "<tr><td class=rows>" + ClipArr[j].details + "</td><td class=rows>" + ClipArr[j].movielink + "</td><td class=rows>tab"+i + "movie" + mone + "</td>";
				table_body = table_body + new_tr;
				mone++;
			}
		}
		document.write(headlineTr+table_rows+table_body);
	}
	var table_end = "</table>";
	document.write(table_end);
}



/*****************************************************************************************************

This sections controls the movie playing flow (shows camera picture and plays the movie 

**************************************************************************************************/
function start_show(url, adiv)
{
	//Changes list item's class and shows the camera pic in the right row 
	if (last_a_div != "")
	{
		old_a_div = document.getElementById(last_a_div);
		old_a_div.className = "list_item";
	}
		current_a_div = document.getElementById(adiv);
		current_a_div.className = "list_item_active";
		last_a_div = adiv;
		// plays the movie
	play_movie(url);
}
function play_movie(url)
{
	movieDiv = GET_AC_FL_RunContent(
								'codebase', 'http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0',
								'width', '425',
								'height', '350',
								'src', url,
								'quality', 'high',
								'pluginspage', 'http://www.macromedia.com/go/getflashplayer',
								'align', 'middle',
								'play', 'true',
								'loop', 'true',
								'scale', 'showall',
								'wmode', 'transparent',
								'devicefont', 'false',
								'id', 'youtubePlayer',
								'bgcolor', '#ffffff',
								'name', 'youtubePlayer',
								'menu', 'true',
								'allowScriptAccess','sameDomain',
								'movie', url,
								'salign', '',
								'swliveconnect', 'true',
								'flashvars', ''
							); 
	document.getElementById("movie").innerHTML = movieDiv;
/*
movieobject=document.getElementById("youtubePlayer");
//movieobject.style.background = "blue";
movieobject.style.width = "425px";
movieobject.style.height = "350px";
new_movie_url = url + ".swf";
//new_movie_url = url;
movieobject.movie = new_movie_url;
movieobject.src = new_movie_url;
*/
//alert(x);
//X.src = url;

}