/// WEIRDEST BUG: Chrome didn't like the name "ads.html"!!!??? this is what caused it to lose the reference to the iframe in the DOM ...?????

var content; /// reference to the div containing the iframe

var myFrame; /// window.frames['iTarget']
var myFrameElem; // document.getElementById("slideFrame"); 

var nTopObjArr = new Array(); // really, not being used

var locs = new Object(); /// look up table for nav objects indexed to url as string
var cLoc = new String(); /// current loc
var cLocObj = null; /// current nav object


$(document).ready(function(){
 	//$("#print-sub").hide(); /// do i need to do this inline to prevent bad jump animation in IE6? 

	content = $('#content');
	
	myFrame = window.frames['iTarget'];
	myFrameElem = document.getElementById("slideFrame");
	
	/// add load event handler to iFrame
	$('#slideFrame').css('overflow', 'hidden');
	$('#slideFrame').load( function( ){ onIFrameLoaded(); } ) 
	
	new NHome();

 	$("#nav-inner").children(".nav0").each( function( i ) {
		nTopObjArr[ nTopObjArr.length ] = new NTop( $(this), i );						
	});
	
	
	var hdr = $("#header");
		
	var add = "ma" + "ilto:awh" + "etzel@" + "me" + ".c" + "om";
	var eContact = $('<a id="eContact" title="'+add+'" href="'+add+'" />');
	eContact.appendTo( hdr );

	var eBlog = $('<a id="eBlog" target="_blank" title="visit my blog" href="http://awhetzel.blogspot.com/" />');
	eBlog.appendTo( hdr );
	
	var eTwitter = $('<a id="eTwit" target="_blank" title="follow me on twitter" href="http://twitter.com/tonyinthecity" />');
	eTwitter.appendTo( hdr );
});

NHome = function(){

	this.fullLoc = this.loc = "front.html"
	this.id = "HOME";
	locs[ this.loc ] = this;
	this.sires = new Array();
	
	var myObj = this;
	var myDiv = $("#header-top");
	myDiv.css( "cursor", "pointer" );
	myDiv.click( function( ){ goLoc( myObj.loc );  } ) 
	
	var homeImg = $("#header-home")
	myDiv.hover( function(){ homeImg.css("display","block"); }, function() { homeImg.css("display","none"); } );
}

/// Top level nav items
NTop = function( elem ){
	this.mainDiv = elem;
	this.owner = null; /// needed only for Objs with no subs
	this.sires = new Array( this );
	this.id = this.mainDiv.attr("id");	
	this.linkView = this.mainDiv.children("a");

	this.subDiv = this.mainDiv.siblings( "#" + this.id + "-sub" );

	if( this.subDiv.length ){
		this.subDiv.hide();
	}
	
	this.fullLoc = this.linkView.attr("href"); ///3.11: need full loc to set loc in showLoc
	this.loc = splitEnd( this.fullLoc );
	locs[ this.loc ] = this;
	
	this.selectedView = $('<div class="plain0" />');
	this.linkView.clone().children().unwrap().appendTo( this.selectedView );
	
	this.selectedView.appendTo( this.mainDiv );
	this.selectedView.css( "display", "none" );	
	
	this.showPlain = function(){
		this.linkView.css( "display", "none" );
		this.selectedView.css( "display", "block" );		
		///# TO DO: SHOULD check to see if it's already open!?		
		if( this.subDiv != null ) this.subDiv.slideDown();//"fast");
	}
	this.showLink = function(){
		this.linkView.css( "display", "block" );
		this.selectedView.css( "display", "none" );		
		if( this.subDiv != null ) this.subDiv.slideUp();//"fast");
	}

	/////

	var myObj = this;
	
	/// add event handlers to link
	this.linkView.click( function( ){ showLoc( myObj.loc ); return false; } ); // "return false" = prevent default link behavior; wait for fade out
	
	////////////////// child elements 
	this.subs = new Array();
	if( this.subDiv != null ){
		this.subDiv.children("div.nav1").each( function( i ) {
			/// I could wrap non-linked "headers" in <a href="#" /> tags here, instead of including them in the html 
			/// but this operation should be done in NObj
				myObj.subs[ i ] = new NObj( myObj, $(this), i );
		});
	}
}

var nObjArr = new Array();

NObj = function( owner, mainDiv, index ){
	this.owner = owner; 
	this.sires = new Array( this.owner, this );
	this.mainDiv = mainDiv;
	this.index = index;	
	this.id = this.mainDiv.attr("id");

	/// add href="#" to non-linking headers
	var hasLink = this.mainDiv.children('a').length;
	if( !hasLink ) var htm = this.mainDiv.children().wrapAll('<a href="#" />');
			
	this.subDiv = $( "#"+ this.id + "-sub" );
	this.linkView = this.mainDiv.children("a");
	
	this.loc = null;
	if( this.subDiv.length ){
		this.subDiv.hide();
	} else {
		/// if no subs ( i.e., "logos" ) then i need a loc prop
		this.subDiv = null;
		this.fullLoc = this.linkView.attr("href"); ///3.11: need full loc to set loc in showLoc
		this.loc = splitEnd( this.fullLoc );		
		locs[ this.loc ] = this;
	}
	
	/// REALLY: html shouldn't have links for any of the subs except LOGOS!! it doesn't
	this.selectedView = $('<div class="plain1" />');
	this.linkView.clone().children().unwrap().appendTo( this.selectedView );
	this.selectedView.appendTo( this.mainDiv );
	this.selectedView.css( "display", "none" );
	
	this.showPlain = function(){
		this.linkView.css( "display", "none" );
		this.selectedView.css( "display", "block" );
		if( this.subDiv != null ) this.subDiv.slideDown();
	}
	this.showLink = function(){
		this.linkView.css( "display", "block" );
		this.selectedView.css( "display", "none" );
		if( this.subDiv != null ) this.subDiv.slideUp();
	}

	/////
	
	var myObj = this;
	
	//////// child elements 
	this.subs = new Array();
	if( this.subDiv != null ){
		this.subDiv.children("div").each( function( i ) {
			myObj.subs[ i ] = new NSub( myObj, $(this), i );		
		});
	}
	
	/// add event handlers to links

	if( hasLink ){
		this.linkView.click( function( ){ showLoc( myObj.loc ); return false; } );// prevent default so i can fade out before changing loc
	} else {
		/// headers have links with href='#' ... prevent them from changing url with "return false"
		/// Show first child and navigate iFrame to it's page
		this.linkView.click( function( ){ showLoc( myObj.subs[0].loc ); return false; } );
	}			
}

NSub = function( owner, mainDiv, index ){
	this.owner = owner;
	this.sires = new Array( this.owner.owner, this.owner, this );
	this.mainDiv = mainDiv;
	this.index = index;
	// THESE DON'T HAVE IDs //this.id = this.mainDiv.attr("id");	
		
	this.linkView = this.mainDiv.children("a");
	this.fullLoc = this.linkView.attr("href");
	this.loc = splitEnd( this.fullLoc );
	
	locs[ this.loc ] = this;
	
	/// REALLY: html shouldn't have links for any of the subs except LOGOS!!
	/// create a DOM element with same text and non-link display
	this.selectedView = $('<div class="plain2" />');
	this.linkView.clone().children().unwrap().appendTo( this.selectedView );

	
	this.showPlain = function(){
		this.linkView.detach();
		this.selectedView.appendTo( this.mainDiv );
	}
	this.showLink = function(){
		this.selectedView.detach();
		this.linkView.appendTo( this.mainDiv );
	}
	
	//////////////////////////

	var myObj = this;
	this.linkView.click( function( ){ showLoc( myObj.loc ); return false; } ); 	// prevent default for fading
	
}

/// return last element of a string.split() array, with default separator, "/" for urls
function splitEnd( strng, sep ){
	if( sep == null ) sep = "/";
	var str = new String( strng )
	var arr = str.split( sep );
	return arr[ arr.length-1 ];
}

function showLoc( locStr ){
	if( locStr == cLoc ) return; /// we're already showing this location
	if( cLocObj != null ){
		//cLocObj.showLink();
		//debug("showLoc: "+ locStr +" cLoc: " + cLocObj.id )
	} else {
		//kludgy to prevent error in comparing owners
		cLocObj = new Object();
		cLocObj.sires = new Array();
		//cLocObj.owner = null;
		cLocObj.id = "NULL";
	}
		
	var nextLocObj = locs[ locStr ];
	
	/// UPDATE NAV
	var iters = nextLocObj.sires.length;
	if( cLocObj.sires.length > iters ) iters = cLocObj.sires.length;
	
	//// TODO: this is where Chrome/Win gets error: "Uncaught TypeError: Cannot read property 'location' of undefined"
	/*debug("$$showLoc CALLED, content== "+ content.children('iframe').attr('id') )
	//
	if( myFrame.location == undefined ){
		debug("IFRAME REFERENCE GONE AWAAAAAAAAAAAY")
	}*/
	/// DEBUGGING	myFrame.location.href = nextLocObj.fullLoc;
	
	
	if( splitEnd( myFrame.location.href ) != splitEnd( nextLocObj.fullLoc ) ){	
	//if( splitEnd( myFrameElem.src ) != splitEnd( nextLocObj.fullLoc ) ){

		content.animate({
			opacity: 0
		}, 250, function() {
			/*if(splitEnd( nextLocObj.fullLoc ) == "front.html"){
				content.css("opacity", "1");
			}*/
			//if( window.frames['iTarget'] == undefined ){ debug("iTarget REFERENCE GONE!!!!!")	}
			if( myFrame.location.href == undefined ){
				///debug("IFRAME href REFERENCE GONE AWAY, using .src")
				/// THIS seems to help with Chrome locally, but not online, now ...???	
				myFrameElem.src = nextLocObj.fullLoc;
			} else {
				myFrame.location.href = nextLocObj.fullLoc;
			}
			
		/// MOVED TO onIFramedloaded:	content.animate( { opacity: 1 }, 1000 )
		});
	}

	/// UPDATE NAV appearance
	var iters = nextLocObj.sires.length;
	if( cLocObj.sires.length > iters ) iters = cLocObj.sires.length;
	
	for( var i = 0; i < iters; i++ ){
		var nSire = null;
		var cSire = null;
		if( nextLocObj.sires.length > i ){
			nSire = nextLocObj.sires[i];
			nSire.showPlain();
		}
		if( cLocObj.sires.length > i ){
			cSire = cLocObj.sires[i];
			if( nSire != cSire ){
				cSire.showLink();
			}
		}
		
	}
	cLoc = locStr;
	cLocObj = nextLocObj;	
}

/// called by header objects when they want to link to their first sub-item
function goLoc( str ){
	showLoc( splitEnd( str ) );
	// myFrameElem.src = str;
	myFrame.location.href = str;
	// window.frames['iTarget'].location = str;
}



var cFrame = null;

/// detects when users navigate via back/forward buttons in browser:
function onIFrameLoaded(){
	var newLoc = splitEnd( myFrame.location.href );
	///content.animate( { opacity: 1 }, 500 );
	if( newLoc != "front.html" ){
		content.animate( { opacity: 1 }, 500 );
	} else {
		/// trying to overcome IE bug where blurb text on front.html is white.
		content.css("opacity", "1");
	}
	// var newLoc = splitEnd( window.frames['iTarget'].location.pathname );
	// debug( "***onIFrameLoaded:: newLoc = "+newLoc);// +" cLoc = "+ cLoc +" byId: " + splitEnd( document.getElementById('slideFrame').src ) );
	document.title = myFrame.document.title.toLowerCase();
	// document.title = myFrameElem.contentDocument.title.toLowerCase();
	// document.title = window.frames['iTarget'].document.title.toLowerCase();
	
	//// if showLoc() has already been called, do nothing; otherwise, if "back" button is used, iframe.onload triggers nav change
	if( cLoc == newLoc ) return;
	
	/// prevent error, but should never happen once every link has an object
	if( locs[ newLoc ] == undefined ) return;		
	showLoc( newLoc );
}