//var baseurl = 'http://timeshapes.com/' ;
var baseurl = '';
var timeoutStarted = false;
var collapseTimeout = null;
var initiateCollapseAll = false;
var MIN_BAR_WIDTH = 940;

window.onload = function() {
	document.getElementById("drop_clocks").onmouseover = expandList;
	document.getElementById("drop_clocks").onmouseout = collapseAllLists;
	document.getElementById("drop_artist").onmouseover = expandList;
	document.getElementById("drop_artist").onmouseout = collapseAllLists;
	document.getElementById("drop_other").onmouseover = expandList;
	document.getElementById("drop_other").onmouseout = collapseAllLists;
	var cells = document.getElementsByTagName("DIV");
	
	for (var i = 0; i < cells.length; i++) {
		if (cells[i].className.indexOf("sidebar_cell") != -1) {
			cells[i].onmouseover = collapseAllLists;
		}
	}
	document.getElementById("main").onmouseover = collapseAllLists;
	window.onresize = windowResize;
	positionDropdowns();
	showLists();
}

function windowResize() {
	var doWindowResize = function() {
		var menuBar = document.getElementById("menu_bar");
		var width = parseInt(getInnerWidth());
		
		if (width < MIN_BAR_WIDTH)
			menuBar.style.width = (MIN_BAR_WIDTH - 3) + "px";
		else
			menuBar.style.width = "100%";
		
		positionDropdowns();
		menuBar.style.left = 0;
		//show(menuBar.style.left);
		timeoutStarted = false;
	}
	
	if (! timeoutStarted) {
		timeoutStarted = true;
		setTimeout(doWindowResize, 500);
	}
}

function menu_goto( menuform )
{
  // Generated by thesitewizard Navigation Menu Wizard 2.3.2
  // Visit http://www.thesitewizard.com/ to get your own
  // customized navigation menu FREE!
  selecteditem = menuform.urls.selectedIndex ;
  newurl = menuform.urls.options[ selecteditem ].value ;

	if (newurl.substring(0, 6) == "mailto")
		fullurl = newurl;
	else
		fullurl = baseurl + newurl;
  	
	if (newurl.length != 0) {
		location = fullurl ;
	}
}

function test()
{
	location = "http://timeshapes.com/table_gallery.htm";
}

function option_click(url) {
	location = url;
}

function the_artist()
{
	document.writeln( '<form class="formclass" name="form1" id="form1" action="chgoto" method="get">' );
	document.writeln( '<form class="formclass" action="chgoto" >' );
	document.writeln( 'The Artist: ' );
	document.writeln( '<select id="drop_list_1" class="drop_list" name="urls" onchange="menu_goto(this.form)" ');
	document.writeln( 'onmouseover="droplistHighlight(1)" >' );
	document.writeln( '<option class="optionclass" value="artists_statement.htm">Artist' + "'" + 's Statement&nbsp;</option>' );
	document.writeln( '<option class="optionclass" value="biographical_statement.htm" onclick="option_click(' + "'biographical_statement.htm'" + ')">Bio Statement</option>' );
	document.writeln( '<option class="optionclass" value="mailto:jdb@acegroup.cc?subject=Timeshapes Inquiry">Email James</option>' );
	document.writeln( '</select>' );
	document.writeln( '<input type="button" class="go_button" onClick="menu_goto(this.form)" ' );
	document.writeln( 'onmouseover="droplistHighlight(1)" value="GO">');
	document.writeln( '</form>' );	
}


function clock_galleries()
{
	document.writeln( '<form class="formclass" name="form2" id="form2" action="chgoto" method="get">' );
	document.writeln( '<form class="formclass" action="chgoto" >' );
	document.writeln( 'Clock Galleries: ' );
	document.writeln( '<select id="drop_list_2" class="drop_list" name="urls" onchange="menu_goto(this.form)" ' );
	document.writeln( 'onmouseover="droplistHighlight(2)" >' );
	document.writeln( '<option class="optionclass" value="floor_gallery_java.htm">Floor Clocks</option>' );
	document.writeln( '<option class="optionclass" value="wall_gallery_java.htm">Wall Clocks</option>' );
	document.writeln( '<option class="optionclass" value="table_gallery.htm">Table Clocks</option>' );
	document.writeln( '<option class="optionclass" value="suspend_gallery.htm">Suspended Clocks </option>' );
	document.writeln( '</select>' );
	document.writeln( '<input type="button" class="go_button" onClick="menu_goto(this.form)" ' );
	document.writeln( 'onmouseover="droplistHighlight(2)" value="GO">');
	document.writeln( '</form>' );
}

function other_galleries()
{
	document.writeln( '<form class="formclass" id="form3" action="chgoto" method="get">' );
	document.writeln( 'Other Galleries: ' );
	document.writeln( '<select id="drop_list_3" class="drop_list" name="urls" onchange="menu_goto(this.form)" ' );
	document.writeln( 'onmouseover="droplistHighlight(3)" >' );
	document.writeln( '<option class="optionclass" value="video_gallery.htm">Video Gallery</option>' );
	document.writeln( '<option class="optionclass" value="westin_gallery.htm">The Westin Hotel Clock</option>' );
	document.writeln( '<option class="optionclass" value="create_30ft_gallery.htm">Creating a 30-Foot Clock </option>' );
	document.writeln( '<option class="optionclass" value="studio_construction.htm">Studio Construction</option>' );
	document.writeln( '</select>' );
	document.writeln( '<input type="button" class="go_button" onClick="menu_goto(this.form)" ' );
	document.writeln( 'onmouseover="droplistHighlight(3)" value="GO">');
	document.writeln( '</form>' );
}

function expandList() {
	clearTimeout(initiateCollapseAll);
	collapseAllListsNow();
	var list = this.getElementsByTagName("LI");
	for (var i = 0; i < list.length; i++) {
		list[i].style.display = "block";
	}
}

function collapseAllListsNow() {
	var lists = document.getElementsByTagName("UL");
	for (var i = 0; i < lists.length; i++) {
		var list = lists[i].getElementsByTagName("LI");
		for (var j = 0; j < list.length; j++) {
			if (list[j].className == "drop_item")
				list[j].style.display = "none";
		}
	}
}

function collapseAllLists() {
	clearTimeout(initiateCollapseAll);
	initiateCollapseAll = setTimeout(collapseAllListsNow, 700);
}

function showLists() {
	document.getElementById("drop_artist").style.display = "block";
	document.getElementById("drop_clocks").style.display = "block";
	document.getElementById("drop_other").style.display = "block";
}

function getInnerWidth()  {
	// if another browser
	if (window.innerWidth)
		return window.innerWidth;
		
	// if Microsoft IE browser
	if (document.documentElement.clientWidth)
		return document.documentElement.clientWidth;
}

function positionDropdowns() {
	var drop = document.getElementById("drop_artist");
	positionElement(drop, 50, "center");
	drop = document.getElementById("drop_clocks");
	positionElement(drop, 6, "left");
	drop = document.getElementById("drop_other");
	positionElement(drop, 7, "right");
}

function positionElement(element, percent, alignment) {
	var left = 0;
	var eWidth = parseInt(element.style.width);
	var barWidth = parseInt(getInnerWidth());
	var halfPt = barWidth / 2;
	
	if (barWidth < MIN_BAR_WIDTH) 
		barWidth = MIN_BAR_WIDTH;
	
	var w;
	if (alignment.toLowerCase() == "left") {
		left = (barWidth * percent / 100);
		element.style.left = left + "px";
	}
	else if (alignment.toLowerCase() == "center") {
		left = ((barWidth * percent / 100) - (eWidth / 2));
		element.style.left = left + "px";
	}
	else if (alignment.toLowerCase() == "right") {
		left = (barWidth - (barWidth * percent / 100) - eWidth);
		element.style.left = left + "px";
	}
}

	function show(content) {
		document.getElementById("temp").innerHTML = content;
	}