$(document).ready(function() {

	ct = $('ul#menu').children().size(); 
	
	//grab img titles and make captions
	var i = 2;
	do { 
		var rmtitle = $('img.nav'+i).attr("title");
		//$('.box'+i).html(rmtitle);
		rmtitle = '<span>'+rmtitle+'</span>';
		$('.nav'+i).parent('li').append(rmtitle);
		i++;
	} while(i <= (ct+1));


/*
	//when mousing over nav, activate boxes on canvas
	$("span[class^=nav]").mouseover(function(Event) {
		var id = this.className.match(/nav(\d+)/)[1];
		$(".box"+id).addClass('active');
		$(".nav"+id).addClass('active');
		$(".nav"+id).mouseout(function() { //undo that on mouseout
			$(".box"+id).removeClass('active');	
			$(".nav"+id).removeClass('active');	
		});
	});
*/


	//hide the <li>s
	$("img.nv").parent('li').hide();

	//when mousing over canvas, activate nav
	$("div[class^=box]").mouseover(function(Event) {
	    var id = this.className.match(/box(\d+)/)[1];
		$(this).addClass('active');
		$(".nav"+id).parent('li').fadeIn('fast').show();
		$(".box"+id).mouseout(function() { //and undo
			$(".nav"+id).parent('li').fadeOut('fast');	
			$(this).removeClass('active');
		});
	});
	
});
