var siteTitle = contents( byTag('title')[0] );
var main_nav_names = [];
var content_pg_names = [];
var divider_padding = 5;
var newRatesWindow = null;
var itemClicked;


function closeRatesWin(){
	if (newRatesWindow !== null){
		if(!newRatesWindow.closed){
			newRatesWindow.close();
		}
	}
}


function popUpRatesWin(url, type, strWidth, strHeight){
	closeRatesWin();
	var tools = "";
	switch( type ){
		case "fullScreen":
			strWidth = screen.availWidth - 10;
			strHeight = screen.availHeight - 160;
		case "standard":
			tools = "resizable,toolbar=yes,location=yes,scrollbars=yes,menubar=yes,width="+strWidth+",height="+strHeight+",top=30,left=200";
			break;
		case "console":
			tools = "resizable,toolbar=no,location=no,scrollbars=no,width="+strWidth+",height="+strHeight+",left=0,top=0";
	}
	newRatesWindow = window.open( url, 'newWin', tools );
	newRatesWindow.focus();
}


function groom_inner( _el ){
	return contents( _el ).trim().spaceToUnderscore();
}


function build_navbar_from( _imglist, _isLargePg ){
	
	var pageWidth = 1100;
	if( _isLargePg === 0 ){
		pageWidth = 780;
		addCSSRule( "#current_content img { margin:0px; left:0px; border-width:0px; width:"+pageWidth+";}" );
		byId('main_navbar').children[1].style.clear = "left";
		byId('main_navbar').style.padding = "28px 0";
		byId('bio_topleft').style.width = "429px";
		byId('bio_topright').style.width = "349px";
	}
	var counts = [];
	
	for( var img_num = 0; img_num < _imglist.length; img_num++ ){
		// chop off the file-extension
		var name = _imglist[img_num].slice( 0, _imglist[img_num].indexOf('.') );
		
		// split the image filename into names and numbers.
		var num_str = name.slice( name.search(/[0-9]/) );
		
		// it's considered malformed if there's anything after the number.
		if( ""+parseInt( num_str, 10 ) != num_str ){ continue; }
		var number = parseInt( num_str, 10 );
		// if there isn't a number in the filename, it doesn't belong in the list.
		if( number < 0 ){ continue; }
		
		// we should have, at this point, WEEDED OUT malformed filenames like:
		// contact.jpg
		// contact2g.jpg
		
		name = name.slice( 0, name.search(/[0-9]/) ).toLowerCase();
		
		if( (counts[name] === undefined && number == 1) || counts[name] + 1 == number ){
			counts[name] = number;
		}
	}
	
	// at this point, we should have a definitive list of how many images
	// of each category there are.
	
	giveAttr( byId('content'),     {'w':pageWidth, 'align':'page-center'} );
	giveAttr( byId('footer'),      {'w':pageWidth, 'align':'page-center'} );
	giveAttr( byId('main_navbar'), {'w':pageWidth, 'align':'page-center'} );
	var main_navbar = byId('main_navbar');
	var main_navitems = main_navbar.getElementsByTagName('li');
	for( var i = 0; i < main_navitems.length; i++ ){
		main_nav_names[i] = groom_inner( main_navitems[i] );
	}
	
	// write out a SECOND navbar
	var second_navbar = mkEl({'tag':'div',
					'id':'second_navbar',
					'w':pageWidth,
					'parent':main_navbar.parentNode,
					'before':main_navbar.nextSibling,
					'align':'page-center'});

	var categ_count;
	for( var c = 0; c < main_nav_names.length; c++ ){
		categ_name = main_nav_names[c];
		categ_count = counts[ categ_name ];
		// if there are no images of that category, and if it's not a special page, strike it from the nav-bar.
		if( categ_count !== undefined ){
			var txt = "";
			if( categ_count > 1 ){
				// fill it with the 'View More' stuff
				txt += "View more:&nbsp;&nbsp;";
				for( var v = 1; v <= categ_count; v++ ){
					txt += "<a>" + v + "</a>&nbsp;&nbsp;";
				}
			}
			var li = document.createElement('li');
			li.innerHTML = txt;
			second_navbar.appendChild( li );
		}
		else if( byId( categ_name+"_content") === undefined ){
			main_navbar.removeChild( categ_name );
			c--;
		}
		else {
			content_pg_names.push( categ_name );
		}
	}
}


function divide_main_navbar( _dividerTxt, _divider_padding ){

	var navbar = byId('main_navbar');
	var navitems = navbar.children;
	var dividers = [];
	
	// color the title all nice
	navitems[0].className = "nav_title";
	
	// insert dividers
	for( var i=2; i<navitems.length; i+=2){
		var divider = document.createElement('div');
		divider.innerHTML = _dividerTxt;
		divider.className = "nav_divider";
		divider.style.paddingLeft = _divider_padding;
		divider.style.paddingRight = _divider_padding;
		dividers.push(divider);
		navbar.insertBefore( divider, navitems[i] );
	}	
}


function pad_main_navbar( _divider_padding, _whetherNavTitle ){
	var navbar = byId('main_navbar');
	var navitems = navbar.children;
	
	// compute how much space to give each divider
	var totalNavItemsWidth = 0;
	var numberNavItems = 0;
	for( var i=1; i<navitems.length; i++){
		totalNavItemsWidth += navitems[i].clientWidth;
		numberNavItems++;
	}
	var remainingSpace = navbar.clientWidth - ( navitems[0].clientWidth * _whetherNavTitle + totalNavItemsWidth + 2*_divider_padding );
	var padAmt = Math.floor( remainingSpace/navitems.length );
	
	// apply the spacing
	for( var j=1; j<navitems.length; j+=2){
		navitems[j].style.paddingLeft = padAmt + "px";
		navitems[j].style.paddingRight = padAmt + "px";
	}
	
	navitems[1].style.paddingLeft = (padAmt+_divider_padding) + "px";
}


function show( _objId ){
	if( _objId == "current" ){
		_objId = main_nav_names[0];
	}
	
	var main_nav = byId('main_navbar').getElementsByTagName('li');
	var second_nav = byId('second_navbar').children;
	var content_pgs = byId('content').children;
	
	for( var c=0; c<content_pgs.length; c++ ){
		content_pgs[c].style.display = "none";
	}
	
	for( var i=0; i<second_nav.length; i++ ){
		second_nav[i].style.display = "none";
		// upon clicking a main-menu item,
		if( groom_inner( main_nav[i] ) == _objId ){
			second_nav[i].style.display = "block";
			byId('current_content').style.display = "block";
			byId('current_content').children[0].setAttribute('src','images/'+_objId+'1.jpg');
			a_tags = second_nav[i].getElementsByTagName('a');
			if( a_tags.length > 1 ){
				for( var a = 0; a < a_tags.length; a++ ){
					a_tags[a].style.textDecoration = "none";
				}
				a_tags[0].style.textDecoration = "underline";
			}
		}
	}
	
	for( var c2=0; c2<content_pgs.length; c2++ ){
		if( content_pgs[c2].id == _objId+"_content" ){
			content_pgs[c2].style.display = "block";
		}
	}
	
	show_more( _objId, 1 );
}


function linkup_main_navbar(){
	var navitems = byId('main_navbar').getElementsByTagName('li');
	for( var i=0; i<navitems.length; i++ ){
		addEvent( navitems[i], 'click',
				function( _evt ){
					var el = ( _evt.currentTarget !== undefined ) ? _evt.currentTarget : _evt.srcElement;
					var name = groom_inner( el );
					show( name );
				}
		);
	}
}


function show_more( _name, _number ){
	if( !content_pg_names.contains(_name) ){
		byId('current_content').children[0].setAttribute('src','images/'+_name+_number+'.jpg');
	}
	
	var siteTitle_ = siteTitle;
	if( _name != main_nav_names[0] ){
		siteTitle_ += " - " + _name.capWords();
	}
	change_title( siteTitle_ );
	scrollbar_adjust();
}


function linkup_second_navbar( ){
	var main_nav = byId('main_navbar').getElementsByTagName('li');
	var second_nav = byId('second_navbar').children;
	for( var i = 0; i < second_nav.length; i++ ){
		second_nav[i].setAttribute('alt', groom_inner( main_nav[i] ) );
		var view_more = second_nav[i].getElementsByTagName('a');
		for( var a = 0; a < view_more.length; a++ ){
			addEvent( view_more[a], 'click',
					function( _evt ){ 
						var el = ( _evt.currentTarget !== undefined ) ? _evt.currentTarget : _evt.srcElement;
						var a_tags = el.parentNode.getElementsByTagName('a');
						for( var a = 0; a < a_tags.length; a++ ){
							a_tags[a].style.textDecoration = "none";
						}
						el.style.textDecoration = "underline";
						show_more( el.parentNode.getAttribute('alt'), groom_inner( el ) );
					}
			);
		}
	}
}


function resize_weird_boxes(){
	show( 'contact' );
	var img = byId("contact_content").getElementsByTagName('img')[0];
	img.parentNode.style.height = ( parseInt( img.style.marginTop, 10 ) + img.clientHeight) + "px";
	show( 'bio' );
	var topleft = byId("bio_topleft");
	var topright = byId("bio_topright");
	topright.style.height = topleft.clientHeight + "px";
	show( main_nav_names[0] );
}


// all this is called ONLY once the image list is built, which is asynchronously
// pulled from the list of images on the server.  (see doMagic() above)
function doMagic2( _imglist ){
	stripWeirdPHPChars();
	_imglist = _imglist.sort();
	var isLargePg = ( screen.width >= 1024 ) ? 1 : 0;
	
	build_navbar_from( _imglist, isLargePg );
	for( var i = 0; i < _imglist.length; i++ ){
		var img = new Image();
		img.src = "images/" + _imglist[i];  // preload
	}
	byId('main_navbar').style.visibility = "visible";
	
	divide_main_navbar('|', divider_padding);
	pad_main_navbar( divider_padding, isLargePg );
	
	linkup_main_navbar();
	linkup_second_navbar();
	
	resize_weird_boxes();
}


function doMagic(){
	var xmlhttp;

	if ( window.XMLHttpRequest !== undefined ) {
		xmlhttp=new XMLHttpRequest();
	} else if( window.ActiveXObject ) {
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}

	xmlhttp.onreadystatechange = function(){
		if( xmlhttp.readyState == 4 ){
			if( xmlhttp.status == 200 ){
				doMagic2( eval( xmlhttp.responseText ) );
			} else {
				alert('error getting images');
			}
		}
	};

	xmlhttp.open( "GET", "helper/img_filename_getter.php", true );	
	xmlhttp.send( null );
}