//var backgroundImageId0='bg_image_img0';
//var backgroundImageId1='bg_image_img1';
var backgroundImageId = 0;
var currentBackgroundClass = 'bg_image_img_height';

var headerbackgroundOn = 0;	//headerbackground veil on 1 or off 0
var selectedOn=0; //0 is none selected 1, 2, 3 for the top three links in about section
var prevSelectedOn=0; //0 is none


var scrollbar;


		var txtColors = new Array();
		var logoColors = new Array();
		
		//Corresponds to Project ID 
		txtColors[0] = 'txt_color0';
		txtColors[1] = 'txt_color1';
		txtColors[2] = 'txt_color2';
		txtColors[3] = 'txt_color3';
		txtColors[4] = 'txt_color4';
		txtColors[5] = 'txt_color5';
		txtColors[6] = 'txt_color6';
		txtColors[7] = 'txt_color7';
		txtColors[8] = 'txt_color8';
		txtColors[9] = 'txt_color9';
		txtColors[10] = 'txt_color10';
		txtColors[11] = 'txt_color11';
		txtColors[12] = 'txt_color12';
		txtColors[13] = 'txt_color13';
		
		logoColors[0] = 'logo_ff0084.png';
		logoColors[1] = 'logo_ff0084.png';
		logoColors[2] = 'logo_0012ff.png';
		logoColors[3] = 'logo_fffc00.png';
		logoColors[4] = 'logo_baff00.png';
		logoColors[5] = 'logo_000a48.png';
		logoColors[6] = 'logo_000a48.png';
		logoColors[7] = 'logo_00ff00.png';
		logoColors[8] = 'logo_ff0084.png';
		logoColors[9] = 'logo_0012ff.png';
		logoColors[10] = 'logo_baff00.png';
		logoColors[11] = 'logo_0012ff.png';
		logoColors[12] = 'logo_000a48.png';
		logoColors[13] = 'logo_ff0084.png';


//Initialize upon window load 
document.observe("dom:loaded", function() {
										

		
		//Detect Window Size
		var height = document.viewport.getHeight();
		var width = document.viewport.getWidth();
		
		//Set Content Envelope Size
		var content_box_height = height - 190;
		content_box_height = content_box_height + 'px';
		$('content_envelope').setStyle({ height: content_box_height });

		
		//Set Background Image Size
		var ratio = width/height;
		
		if(ratio > 1.5){
			
				$$('img.bg_image_img').each(function(elem) {
					elem.removeClassName('bg_image_img_height');
					elem.addClassName('bg_image_img_width');
					currentBackgroundClass = 'bg_image_img_width';
				});
					
		}else{
				$$('img.bg_image_img').each(function(elem) {
					elem.removeClassName('bg_image_img_width');
					elem.addClassName('bg_image_img_height');
					currentBackgroundClass = 'bg_image_img_height';
				});
			
		}
		
	
		//slideShowTimer = window.setInterval( "mySlideShow()", 4500 );	
		
		//Set Logo
		$('logo').update('<img src="images/' + logoColors[currentProject] + '" />');
		
		//Set Text Color
		$$('p.about_txt').each(function(elem) {
					elem.addClassName(txtColors[currentProject]);
				});
		
		$$('a.about_txt_link').each(function(elem) {
					elem.addClassName(txtColors[currentProject]);
				});
		
		$$('p.footer_txt').each(function(elem) {
					elem.addClassName(txtColors[currentProject]);
				});

		$$('a.footer_txt_link').each(function(elem) {
					elem.addClassName(txtColors[currentProject]);
				});
		
		//Startup Sequence
		$('bg_image_veil').fade({duration: 3.0}); //Fade Veil instead of image
		$('loading').fade({duration: 2.0});	//Fade Loading
		$('logo').appear({duration: 3.0});
		$('logow').fade({duration: 2.0});

		
		//Initialize Scrollbar
		scrollbar = new Control.ScrollBar('content_main','content_track');  
		
});


//Observe Window Size and Assign Style
Event.observe(document.viewport.onresize ? document : window, "resize", resizeWindowFunction);


function resizeWindowFunction(){
	//Detect Window Size
		var height = document.viewport.getHeight();
		var width = document.viewport.getWidth();
		var ratio = width/height;
		
		//Set Content Envelope Size
		var content_box_height = height - 190;
		content_box_height = content_box_height + 'px';
		$('content_envelope').setStyle({ height: content_box_height });
		
		
		//	console.log("height: " + height + " width: " + width);
		
		//Set Background Image Size
		if(ratio > 1.5){
			
				$$('img.bg_image_img').each(function(elem) {
					elem.removeClassName('bg_image_img_height');
					elem.addClassName('bg_image_img_width');
					currentBackgroundClass = 'bg_image_img_width';
				});
					
		}else{
				$$('img.bg_image_img').each(function(elem) {
					elem.removeClassName('bg_image_img_width');
					elem.addClassName('bg_image_img_height');
					currentBackgroundClass = 'bg_image_img_height';
				});
			
		}
}

//Reveal Background Veil (headerbackground)
function revealVeil(myvalue,specificproject){
	
	currentProject = specificproject;
	
	if(headerbackgroundOn==0){
		//Turn Veil On
		//myvalue 1: About; 2: Project list; 3: Specific project
		headerbackgroundOn=1;
		
		selectedOn=myvalue;
		
		
		var selectedlink = 'link' + selectedOn;
		
		$(selectedlink).addClassName('selected');
		
		$('headerbackground').setOpacity(0);
		new Effect.Morph('headerbackground', {
			duration: 0.75,
			style: 'height: 100%; opacity: .55;'});
		
		$$('p.about_txt').each(function(elem) {
					
					$(elem).addClassName('white_txt');
					
				});

		$$('p.footer_txt').each(function(elem) {
					
					$(elem).addClassName('white_txt');
					
				});

		$$('body a').invoke('addClassName', 'veiled');
		
		Effect.Fade('logo', {duration: 0.75});
		Effect.Appear('logow', {duration: 0.75});
		
		//Close Link Appear
		Effect.Appear('closelink', {duration: 0.75});

		
		//Call Ajax
		loadingMainContent();

	}else{
		selectedOn=myvalue;
		var selectedlink = 'link' + selectedOn;
		var prevselectedlink = 'link' + prevSelectedOn;
		
		
		$(prevselectedlink).removeClassName('selected');
		$(selectedlink).addClassName('selected');
		
		//Call Ajax
		loadingMainContent();

	}
}



function loadingMainContent(){
	
	//Check to see if there is already content
	if(prevSelectedOn==0){	//If no content, load new content
	
		var php_string = 'prev_selection=' + prevSelectedOn + '&current_selection=' + selectedOn + '&current_project=' + currentProject;
	
		var oOptions = {
				method: 'get',
				parameters: php_string, 	//TACKS ON VARIABLES TO PHP
				onComplete:resizeContentMain
				};
				
		var oRequest = new Ajax.Updater({success: 'content_main'}, 'filecall_extras.php', oOptions);
		
		scrollbar.recalculateLayout();
		
		//$('content_envelope').show();	//different methods of show
	
		prevSelectedOn=selectedOn;
	
	}else{	//If has content, erase previous content and then load new content
		
		if(prevSelectedOn!=selectedOn){	//show content only if prevSelectedOn is different from the current selection
			//Erase previous content
			//$('content_main').update();
	
			//Place in new content
			var php_string = 'prev_selection=' + prevSelectedOn + '&current_selection=' + selectedOn + '&current_project=' + currentProject;
			
			
			var oOptions = {
					method: 'get',
					parameters: php_string, 	//TACKS ON VARIABLES TO PHP
					onSuccess: resizeContentMain,
					onComplete: resizeContentMain
					};
					
			var oRequest = new Ajax.Updater({success: 'content_main'}, 'filecall_extras.php', oOptions);
			

			
			//$('content_envelope').show();	//different methods of show
		
			prevSelectedOn=selectedOn;
		}
			
	}
	
		
}




//Resize Content Box for scrollbar
function resizeContentMain(){
	scrollbar.recalculateLayout();
}

//Close Veil and content
function closeEverything(){
	if(headerbackgroundOn == 1){		
		headerbackgroundOn = 0;	//headerbackground veil
		

		$('content_main').update();
		resizeContentMain();
		
		var selectedlink = 'link' + selectedOn;
		$(selectedlink).removeClassName('selected');
		
		
		new Effect.Morph('headerbackground', {
			duration: 0.75,
			style: 'height: 0%; opacity: 0;'});
		
		
		$$('p.about_txt').each(function(elem) {
					
					$(elem).removeClassName('white_txt');
					
				});
		

		$$('p.footer_txt').each(function(elem) {
					
					$(elem).removeClassName('white_txt');
					
				});
		

		
		$$('body a').invoke('removeClassName', 'veiled');
		
		Effect.Appear('logo', {duration: 0.75});
		Effect.Fade('logow', {duration: 0.75});
		
		//Close Link Appear
		Effect.Fade('closelink', {duration: 0.75});
		
		selectedOn=0; //0 is none selected
		prevSelectedOn=0; //0 is none
	}
}





//Change Projects
function changeProjects(newproject, newprojectimage, newprojectname, newprojectmedia){
	
	currentProject = newproject;
	
	//console.log(previousProject + ',' + currentProject);
	
	//Set Logo
		$('logo').update('<img src="images/' + logoColors[currentProject] + '" width="240" height="80" />');
	
	//Change Text Color
	$$('p.about_txt').each(function(elem) {
					
					$(elem).removeClassName(txtColors[previousProject]);
					$(elem).addClassName(txtColors[currentProject]);
				});
	
		$$('a.about_txt_link').each(function(elem) {
					
					$(elem).removeClassName(txtColors[previousProject]);
					$(elem).addClassName(txtColors[currentProject]);
					
				});

		$$('p.footer_txt').each(function(elem) {
					
					$(elem).removeClassName(txtColors[previousProject]);
					$(elem).addClassName(txtColors[currentProject]);
					
				});
		
				$$('a.footer_txt_link').each(function(elem) {
					
					$(elem).removeClassName(txtColors[previousProject]);
					$(elem).addClassName(txtColors[currentProject]);
					
				});
	
	$('bg_image').update('<img src="images_projectpromo/' + newprojectimage + '" class="bg_image_img" />');
	resizeWindowFunction();
	
	$('about3').update('<p class="about_txt ' + txtColors[currentProject] + ' white_txt"><strong><a href="" id="link3" onclick="revealVeil(3,' + newproject + '); return false;" class="about_txt_link ' + txtColors[currentProject] + ' veiled">' + newprojectname  + '</a><br /></strong>' + newprojectmedia + '</p>');
	
	
	previousProject = currentProject;
}






//
/*
var slideShow=new Array(); 
slideShow[0]="test.jpg";
slideShow[1]="test2.jpg";
slideShow[2]="test3.jpg";

var showPageOn = 0;
var slideShowOn = 0;
var slideShowSlide = 0;


//Slideshow Function
function mySlideShow(){
		
	//Advance Slideshow counter
	if( slideShowSlide >= slideShow.length-1 ){
		slideShowSlide = 0;
	}else {
		slideShowSlide++;
	}
	
	//Load new image
	if(backgroundImageId==0){
		backgroundImageId=1;
		$('bg_image').insert('<img src="images/' + slideShow[slideShowSlide] + '" style="opacity: 0; filter: alpha(opacity=0); z-index: 2;" class="bg_image_img ' + currentBackgroundClass + '" id="' + backgroundImageId1 + '"/>');
		//Fade In after delay to allow image to load
		new Effect.Opacity(backgroundImageId1, {from: 0.0, to: 1.0, delay: 1.0, duration: 1.5, afterFinish: function(){ 	$(backgroundImageId0).remove(); }});
	
	}else{
		backgroundImageId=0;
		$('bg_image').insert('<img src="images/' + slideShow[slideShowSlide] + '" style="z-index: 1;" class="bg_image_img ' + currentBackgroundClass + '" id="' + backgroundImageId0 + '"/>');
		
		//Fade Out after delay to allow image to load
		new Effect.Opacity(backgroundImageId1, {from: 1.0, to: 0.0, delay: 1.0, duration: 1.5, afterFinish: function(){ $(backgroundImageId1).remove(); }});
	
	}
	

}
*/

//