/* jsquery scrollable wrapper functions */

function makeScrollable(wrapper, scrollable){

	// Get jQuery elements
	var wrapper = $(wrapper), scrollable = $(scrollable);
	
	// Hide images until they are not loaded
/*	scrollable.hide();*/
	var loading = $('<div class="loading">Loading...</div>').appendTo(wrapper);
	
	// Set function that will check if all images are loaded
	var interval = setInterval(function(){
		var images = scrollable.find('img');
		var completed = 0;

		// Counts number of images that are succesfully loaded
		images.each(function(){
			if (this.complete) completed++;	
		});
			
		if (completed == images.length){
			clearInterval(interval);
			// Timeout added to fix problem with Chrome
			setTimeout(function(){
					
				loading.hide();
				// Remove scrollbars	
				wrapper.css({overflow: 'hidden'});						
				
				scrollable.slideDown('slow', function(){
					enable();	
				});					
			}, 1000);	
		}
	}, 100);
	
	function enable(){			
		// height of area at the top at bottom, that don't respond to mousemove
		var inactiveMargin = 100;
		// Cache for performance
		var wrapperWidth = wrapper.width();
		var wrapperHeight = wrapper.height();

		// Using outer height to include padding too
		var scrollableHeight = scrollable.outerHeight() + 2*inactiveMargin;
		// Do not cache wrapperOffset, because it can change when user resizes window
		// We could use onresize event, but it's just not worth doing that
		// var wrapperOffset = wrapper.offset();
	
		//When user move mouse over menu
		wrapper.mousemove(function(e){
		var wrapperOffset = wrapper.offset();
		// Scroll menu
		var top = (e.pageY - wrapperOffset.top) * (scrollableHeight - wrapperHeight) / wrapperHeight - inactiveMargin;
	
		if (top < 0){
		top = 0;
		}
	
		wrapper.scrollTop(top);
		});
	}
}
	
/* curtain scrollfunctions */

$(document).ready(function() {	

	$.get("xml_files/episodes.txt",function(data){
  	parseVideoXml(data);
	});

	$.get("xml_files/students.txt",function(data){

		chosenStudentName = getURLParm('student');

  		parseStudentXml(data);
		counter = 0;

		// Build an HTML string

		myHTMLOutput = '';
		// Run the function for each student tag in the XML file

		for (counter in StudentsNamesArray) {

			studentName = StudentsNamesArray[counter];

			// Build row HTML data and store in string
			mydata = BuildStudentHTML(studentName);

			myHTMLOutput = myHTMLOutput + mydata;
		};
		// Update the DIV called Content Area with the HTML string

		myHTMLOutput = '<ul class="students_images_list">' + myHTMLOutput
		myHTMLOutput += '</ul>'

		$(".students_images").append(myHTMLOutput);

		//Get our elements for faster access and set overlay width
		var div = $('div.students_images'),
			ul = $('ul.students_images_list'),
			ulPadding = 15;
		
		//Get menu width
		var divWidth = div.width();
	
		//Remove scrollbars	
		div.css({overflow: 'hidden'});
		
		//Find last image container
		var lastLi = ul.find('li:last-child');
		
		//When user move mouse over menu
		div.mousemove(function(e){
			//As images are loaded ul width increases,
			//so we recalculate it each time
			var ulWidth = lastLi[0].offsetLeft + lastLi.outerWidth() + ulPadding;
			var left = (e.pageX - div.offset().left) * (ulWidth-divWidth) / divWidth;
			div.scrollLeft(left);
		});

		BuildSelectedStudentHTML(chosenStudentName);
	});

	$(".leftcurtain").stop().animate({width:'60px'}, 0 );
	$(".rightcurtain").stop().animate({width:'60px'},0 );
});	

/* Build Student HTML String */
 
function BuildStudentHTML(studentName){	
	// Build HTML string and return

	output = '<li><a onclick="BuildSelectedStudentHTML(';
	output += "'"+studentName+"'";
	output += ');"><img src="images/Images_actors/';
	output += studentName;
	output += '.jpg" alt=""';
	output += studentName;
	output += '" /></a></li>';
/*
	output = '<li><a href="students.html?student=';
	output += studentName;
	output += '"><img src="images/Images_actors/';
	output += studentName;
	output += '.jpg" alt="';
	output += studentName;
	output += '" /></a></li>';*/

	return output;
}

/* Build Student HTML String */
 
function BuildSelectedStudentHTML(chosenStudentName){

	if (chosenStudentName == '') {
		return;
	}
	// Build HTML string and insert

	myHTMLOutput = '<img src="images/Images_actors/';
	myHTMLOutput += chosenStudentName;
	myHTMLOutput += '.jpg" alt=""';
	myHTMLOutput += chosenStudentName;
	myHTMLOutput += '" />';

	$("#student_chosen").empty();
	$("#student_chosen").append(myHTMLOutput);
	$("#video_flash").empty();
	
	BuildSelectedStudentVideosHTML(chosenStudentName);

	facebookId = '';
	twitterId = '';
	studentBio = '';

	for (counter in StudentsNamesArray){
		if(chosenStudentName == StudentsNamesArray[counter]){
			facebookId = StudentsFacebookArray[counter];
			twitterId = StudentsTwitterArray[counter];
			studentBio = StudentsBioArray[counter];
		}
	}

	BuildTwitterHTML(twitterId);
	BuildFacebookHTML(facebookId);
	BuildBioHTML(studentBio);
}

/* Build Student Videos String */
 
function BuildSelectedStudentVideosHTML(chosenStudentName){	

	myHTMLOutput = '';

	for (videoCounter in videoShortName) {
		if (videoStudentsArray[videoCounter].search(chosenStudentName+";") >= 0) {
			if (videoType[videoCounter].toUpperCase() == 'EPISODE') {
				videoDisplayShortName = videoShortName[videoCounter] + ' - ' + videoLongName[videoCounter];			
			}else {
				videoDisplayShortName = videoLongName[videoCounter];			
			}
			
			myHTMLOutput += BuildSelectedVideoListHTML(videoCounter,videoDisplayShortName);
		}
	}

	$("#videos_list_container").empty();

	if (myHTMLOutput == '') {
		return;
	}
	
	myHTMLOutput = '<ul id="videos_list">' + myHTMLOutput
	myHTMLOutput += '</ul>'
	
	$("#videos_list_container").append(myHTMLOutput);

	makeScrollable("#videos_list_container", "#videos_list");
}

/* Parse Student XML & Build Arrays */
 
function parseStudentXml(xml) {	

	var videoCounter = 0;

	videoXmlToSearch = xml;

	videoLastEpisode = '';
	
	iVideoStartPosition = videoXmlToSearch.search('<student>') + 8;
	iVideoEndPosition =  videoXmlToSearch.search('</student>');

	while (iVideoStartPosition > 8) {
	
		StudentsNamesArray[videoCounter] = parseXml(videoXmlToSearch.substring(iVideoStartPosition,iVideoEndPosition),'student_name');
		StudentsTwitterArray[videoCounter] = parseXml(videoXmlToSearch.substring(iVideoStartPosition,iVideoEndPosition),'twitter_id');
		StudentsFacebookArray[videoCounter] = parseXml(videoXmlToSearch.substring(iVideoStartPosition,iVideoEndPosition),'facebook_id');
		StudentsBioArray[videoCounter] = parseXml(videoXmlToSearch.substring(iVideoStartPosition,iVideoEndPosition),'biography');

		videoXmlToSearch = videoXmlToSearch.substring(iVideoEndPosition + 10);

		iVideoStartPosition = videoXmlToSearch.search('<student>') + 8;
		iVideoEndPosition =  videoXmlToSearch.search('</student>');
		videoCounter++;
	}
}

/* Build Student Facebook String */
 
function BuildFacebookHTML(facebookId){	

	$("#content_footer_facebook").empty();

	if (facebookId == '') {
		return;
	}

	// Build HTML string and return
	myHTMLOutput = '<fb:fan profile_id="';
	myHTMLOutput += facebookId;
	myHTMLOutput += '" stream="" connections="10" width="340"></fb:fan>';

	$("#content_footer_facebook").append(myHTMLOutput);
	FB.init("86575f8f2cd1a3fc0937f68249d2fc0e");
}

/* Build Student Twitter String */
 
function BuildTwitterHTML(twitterId){	

	$("#content_footer_twitter").empty();

	if (twitterId == '') {
		return;
	}

	// Build HTML string and return
	myHTMLOutput = '<object type="application/x-shockwave-flash" data="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" width="340" height="550" id="TwitterWidget">';
	myHTMLOutput += '<param name="movie" value="http://static.twitter.com/flash/widgets/profile/TwitterWidget.swf" />';
	myHTMLOutput += '<param name="allowScriptAccess" value="always" />';
	myHTMLOutput += '<param name="allowFullScreen" value="false" />';
	myHTMLOutput += '<param name="quality" value="high" />';
	myHTMLOutput += '<param name="bgcolor" value="#000000" />';
	myHTMLOutput += '<param name="FlashVars" value="userID=';
	myHTMLOutput += twitterId;
	myHTMLOutput += '&amp;styleURL=http://static.twitter.com/flash/widgets/profile/revo.xml" /></object>';

	$("#content_footer_twitter").append(myHTMLOutput);
}

/* Build Biography String */
 
function BuildBioHTML(studentBio){	
	
	$("#content_student_bio").empty();

	// Build HTML string and return
	myHTMLOutput = '<p id="student_chosen_bio">Student Biography</p>';
	myHTMLOutput += '<p id="student_chosen_bio_detail">';
	myHTMLOutput += studentBio;
	myHTMLOutput += '</p>';

	$("#content_student_bio").append(myHTMLOutput);
}