// DECLARE VARIABLES
var menu=new Array();								// [content1, background1],[content2, background2],...
menu[0]=[['projects','Projects.jpg']]; 
menu[1]=[['hublot','Hublot.jpg']]; 
menu[2]=[['chanel','Chanel.jpg']];
menu[3]=[['ulrich_engler_couture','Ulrich_Engler_Couture.jpg']];
menu[4]=[['index_dubai_origami','Index_Dubai_Origami.jpg'],['index_dubai_adventure','Index_Dubai_Adventure.jpg']];
menu[5]=[['residential_metal_curls','Residential_Metal_Curls.jpg'],['residential_gold_fringes','Residential_Gold_Fringes.jpg']];	
menu[6]=[['beck_textile_studio','BECK_TEXTILE_STUDIO.jpg']]; 
menu[7]=[['contact_information','Contact.jpg'],['contact_press','Press.jpg']];
var selection;			// Current menu selection.
var subselection;		// Current sub menu selection.
var content;			// Current content showing.		
var loading;			// Most resent background loading (filename).
var onemoment;			// Reference to "ONE MOMENT" showing
var onemomenttimeout;	// Reference to the timeout that calls onemoment().


// UPDATE MENU
// Highlights what the mouse is hovering and the selected menu and sub menu.
// All other menus are un-highlighted and sub menus are hidden.
function updatemenu(a, b){
	for (var i = 0; i < menu.length; i++){											// Run through all menus...
		var t = document.getElementById('menu' + i).getElementsByTagName('div');
		if (i == a || i == selection){													// If this menu is specified or selected...	
			t[0].style.background = '#FFFFFF';												// Highlight this menu.
			t[0].style.color = '#000000';
		} else {
			t[0].style.background = '#000000';												// Otherwise un-highlight this menu.
			t[0].style.color = '#FFFFFF';			
		}
		if (menu[i].length > 1){														// If this menu has a sub menu...
			for (var ii = 0; ii < menu[i].length; ii++){									// Run through all the sub menus...
				if (i == a || i == selection){													// If this menu is selected or specified...										
					t[ii + 1].style.display = 'block';												// Show this sub menu.
					if ((i == selection && ii == subselection) || (i == a && ii == b) || (ii == 0 && i == a && i != selection && b == undefined)){
						t[ii + 1].style.background = '#FFFFFF';	
						t[ii + 1].style.color = '#000000';
					} else {
						t[ii + 1].style.background = '#000000';	
						t[ii + 1].style.color = '#FFFFFF';
					}
				} else {
					t[ii + 1].style.display = 'none';												// Otwerwise hide this sub menu.
				}
			}
		}
	}	
}


// SELECT MENU
// Selects a menu and begins loading the background.
function selectmenu(a, b){
	if (b == undefined){															// If no sub menu has been specified...
		if (a == selection){															// ...and if the specified menu is already selected, we do not change the sub menu.
			b = subselection;
		} else {																		// Otherwise, if this menu is not selected, we select the first sub menu.
			b = 0;
		}
	}
	if (selection != a || subselection != b){										// If this selection is differnet from what is already selected...							
		selection = a;																	// Select specified, new menu and sub menu.
		subselection = b;
		updatemenu();																	// Update the menu to un-highlight the old selection.
		img = new Image();																// Create a new image object.
		img.onload = function(){											
			if (loading == menu[a][b][1]){													// If this is still the background that was last requested last...
				loading = undefined;															// Complete loading.
				if (onemoment != undefined) {													// Hide "ONE MOMENT" if showing.
					onemoment.style.display = 'none';							
				}
				document.getElementById('landingpage').style.display = 'none';					// Hide the landing page logo.
				document.getElementById('logo').parentNode.style.visibility = 'visible';		// Show the logo.
				document.getElementById('menu').style.visibility = 'visible';					// Show the menu.
				document.getElementById('background').style.visibility = 'visible';				// Show the background.
				document.getElementById('backgroundimage').src = 'images/' + menu[a][b][1];
				if (document.getElementById(content)){											// Hide current content if exists.
					document.getElementById(content).style.display = 'none';
				}
				content = menu[a][b][0];														// Save a reference to the new content so we know what to hide later.
				if (document.getElementById(content)){											// Show new content if such exists.
					document.getElementById(content).style.display = 'block';
				}
				// TODO: Add anchor to the URL so this page can be linked directly to.
			}
		}
		if (onemoment != undefined) {													// Hide "ONE MOMENT" if showing.
			onemoment.style.display = 'none';							
		}
		clearTimeout(onemomenttimeout);													// Show "ONE MOMENT" in 1 second.
		onemomenttimeout = window.setTimeout('showonemoment()', 1000);
		loading = menu[a][b][1];														// Save a reference to the image file.
		img.src = 'images/' + loading;													// Begin loading.
	}
}


// ONE MOMENT
// Shows "ONE MOMENT" for selection. 
function showonemoment(){
	if (loading != undefined){																// If we are still loading...											
		var t = document.getElementById('menu' + selection).getElementsByTagName('div');		// Save a reference to the new "ONE MOMENT".
		onemoment = t[t.length-1];																
		onemoment.style.display = "block";														// Show "ONE MOMENT" for selection.
	}
}