// JavaScript Document
	
	// Globals
	var _xhReq	= null;
	var _xhReq2	= null;
	
	function detectBrowser()
	{
		var browser		= navigator.appName;
		var b_version	= navigator.appVersion;
		var version		= parseFloat( b_version );
		
		// alert( browser + "\n" + b_version + "\n" + version );
		
		if ( browser == "Netscape" && b_version.search( 'Safari' ) < 0 )	
			return "FF";
		else if ( browser == "Microsoft Internet Explorer" && version >= 4 )
			return "IE";
        else if (browser == "Netscape")
            return "Chrome";
		else
			return "This site only supports Microsoft Internet Explorer (7+) and Mozilla Firefox (3+).";
	} // end detectBrowser()
	
	function prepAndGo( name )
	{
		// Reset tab fx
		clearTabs();
		
		// Do tab 'selection' fx
		var tabTextEl = document.getElementById( name + '_tab' ).getElementsByTagName( "*" )[ 0 ];
		tabTextEl.className = "rel_pos tab_text_selected";
		
		// wipe( 'content_panel', "rel_pos center" );

		document.getElementById( 'content_panel' ).style.visibility = "hidden";
		
		// Tab animation
		getAniPage();	
				
		// Ajax call to home_page_content
		_xhReq2 = createXMLHttpRequest();			
		if ( _xhReq2 != null )
		{
			_xhReq2.open("GET", name + "_content.php", true);
			_xhReq2.onreadystatechange = doResponse;
			_xhReq2.send(null);			
		} // end if
		else
		{
			alert( '_xhReq is null' );
		} // end else
				
	} // end prepAndGo()	
	
	function wipe( elId, cls )
	{
		// document.getElementById( elId ).innerHTML = "";		
		var target 	= document.getElementById( elId );
		var parent	= target.parentNode;
		parent.removeChild( target );
				
		var el 			= document.createElement( 'div' );
		el.id 			= elId;
		el.className	= cls;

		parent.insertBefore( el, parent.getElementsByTagName( "*" )[ 0 ] );

	} // end wipe()
	
	function createXMLHttpRequest()
	{
		try { return new XMLHttpRequest(); } catch(e) {}
		try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch (e) {}
		try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch (e) {}
		alert("XMLHttpRequest not supported");
		return null;	
	} // end createXMLHttpRequest()

	function doResponse()
	{
		if ( _xhReq2.readyState == 4 ) 
		{
			loadContent( _xhReq2.responseText );
			performTasks();
		} // end if
		else return;
	} // end doResponse()
	
	function getAniPage()
	{
		var pageToFetch	= ( _xhReq2 == null ) ? 
						"tab_open_anim2.html" : "tab_open_anim2.html";
		// alert( "fetching page: " + pageToFetch );
		// Ajax call to home_page_content
		_xhReq = createXMLHttpRequest();			
		if ( _xhReq != null )
		{
			_xhReq.open("GET", pageToFetch, true);
			_xhReq.onreadystatechange = doAnim;
			_xhReq.send(null);			
		} // end if
		else
		{
			
		} // end else
		
	} // end getAniPage()

	function doAnim()
	{
		if ( _xhReq.readyState == 4 )
		{
			var el 			= document.createElement( 'div' );
			el.innerHTML	= _xhReq.responseText;
			
			document.getElementById( 'x' ).innerHTML 	= _xhReq.responseText;	
			// setTimeout( "document.getElementById( 'x' ).style.zIndex = '0';", 10000 );
			setTimeout( "document.getElementById( 'content_panel' ).style.visibility = 'visible';", 1000 );			
		} // end if
	}

	function loadContent( content )
	{
		document.getElementById( 'content_panel' ).innerHTML = content;
		
	} // end loadContent()
	
	function performTasks()
	{
		var mode = _xhReq2.responseText;
		
		if ( mode.search( 'home_content' ) >= 0 )
		{
			doHomeTasks();			
		} // end if
			
		else if ( mode.search( 'portfolio_content' ) >= 0 )
		{
			doPortfolioTasks();
		} // end if

		else if ( mode.search( 'contact_content' ) >= 0 )
		{
			// showRecaptcha('dynamic_recaptcha_1', 'submit_button_1', 'red');
			// doContactTasks();
		} // end if

		else if ( mode.search( 'about_content' ) >= 0 )
		{
			doAboutTasks();
		} // end if
		
		else
			alert( 'An error has occured (1)' );

	} // end performTasks()

	/*
	 *	Centers an element 'vertically & horizontally' relative to its parent.
	 */
	function center( el )
	{
		if ( el != null )
		{
			centerHorizontal( el );
			centerVertical( el );
		} // end if

	} // end centerElement()	

	/*
	 *	Centers an element 'horizontally' relative to its parent.
	 */
	function centerHorizontal( el )
	{
		if ( el != null )
		{
			var parent 		= el.parentNode;
			var prWidth		= parent.offsetWidth;
			var posX		= ( prWidth / 2 ) - ( el.offsetWidth / 2 );
			el.style.right 	= posX + "px";
		} // end if

	} // end centerElement()

	function doCenterHorizontal( el, targetEl )
	{
		if ( el != null && targetEl != null )
		{							
			var targetWidth;
			if ( targetEl == "*" )
				targetWidth		= window.screen.availWidth;
			else
				targetWidth		= targetEl.offsetWidth
			var posX			= ( targetWidth / 2 ) - ( el.offsetWidth / 2 );
			el.style.left 		= posX + "px";
		} // end if
		else
			alert( 'error -doCenterHorizontal' );

	} // end centerElement()
	
	/*
	 *	Centers an element 'vertically' relative to another element.
	 */
	function centerVertical( el, targetEl )
	{
		if ( el != null && targetEl != null )
		{			
			var targetHeight	= targetEl.offsetHeight;
			var posY			= ( targetHeight / 2 ) - ( el.offsetHeight / 2 );
			el.style.top 		= posY + "px";
		} // end if

	} // end centerElement()
	
	function clearTabs()
	{
		var tabNames = [ 'home_tab', 'portfolio_tab', 'contact_tab', 'about_tab' ];

		for ( var i = 0; i < tabNames.length; i++ )
		{
			var tabTextEl = document.getElementById( tabNames[ i ] ).getElementsByTagName( "*" )[ 0 ];
			tabTextEl.className = "rel_pos tab_text";
		} // end for
		
	} // end clearTabs()
					
	function showError( msg )
	{
		new DialogPanel( msg );
		
	} // end showError()
	
	function DialogPanel( msgText, func )
	{
		this.el								= document.createElement( 'div' );
		this.el.id							= "dialog_panel";
		this.el.className					= "dialog_panel center rel_pos"
		this.el.style.width					= "408px";
		this.el.style.height				= "158px";
		this.el.style.top					= "-232px";
		this.el.style.backgroundImage		= "url( 'public/images/dialog_panel_bg.png' )";
		this.el.style.zIndex				= "1";
				
		document.getElementById( 'main_panel' ).appendChild( this.el );
		
		// Add message
		var msg								= document.createElement( 'div' );
		msg.id								= "dialog_msg";
		msg.className						= "center rel_pos dislog_text_0";
		msg.innerHTML						= msgText;
		
		document.getElementById( 'dialog_panel' ).appendChild( msg );
		
		// Add confirmation button
		this.btn_OK							= document.createElement( 'div' );
		this.btn_OK.id						= "btn_ok";
		this.btn_OK.className				= "center rel_pos";
		this.btn_OK.style.backgroundImage	= "url( 'public/images/btn_ok.png' )";
		this.btn_OK.style.width				= "106px";
		this.btn_OK.style.height			= "40px";
		this.btn_OK.style.top				= "50px";
						
		document.getElementById( 'dialog_panel' ).appendChild( this.btn_OK );
		
		// Button listeners
		attachEventListener( this.btn_OK.id, 'mousedown', function( event ){ doHoverFx( event ); }, false );
		attachEventListener( this.btn_OK.id, 'mouseup', 	function( event )
														{	hideHoverFx( event );	
															closePanel(); 
															if ( func != null ) 
																func(); 
														}, false );		
		
	} // end DialogPanel class
	
	function closePanel()
	{
		var el		= document.getElementById( 'dialog_panel' );
		var parent	= el.parentNode;
		
		parent.removeChild( el );		
	} // end close()
	
	function validate( text )
	{
		var regex1	= /^[A-Za-z0-9@ \r\n . \- \* , \( \) \? \: \! \' \< \> \/ \:]+$/;
		var regex2	= /^[ ]+$/;
		
		if ( text != null && text.match( regex1 ) && !text.match( regex2 ) )
			return text;
		else
			return null;
	} // end validate()
	
	function doHoverFx( event )
	{
		var el;	
		if ( detectBrowser() == "FF" )
			el = document.getElementById( event.currentTarget.id );
		else
			el = document.getElementById( window.event.srcElement.id );
			
		if ( el != null )
			el.style.backgroundImage 	= "url( 'public/images/thumbs/" + el.id + "_hover.png' )";
		
	} // end doHoverFx()
	
	function hideHoverFx( event )
	{
		var el;	
		if ( detectBrowser() == "FF" )
			el = document.getElementById( event.currentTarget.id );
		else
			el = document.getElementById( window.event.srcElement.id );
			
		if ( el != null )
			el.style.backgroundImage 	= "url( 'public/images/thumbs/" + el.id + ".png' )";
		
	} // end doHoverFx()
	
	function loadXMLDoc( dName ) 
	{
		var xmlDoc;
		if ( window.XMLHttpRequest )
		{
		  xmlDoc = new window.XMLHttpRequest();
		  xmlDoc.open( "GET",dName,false );
		  xmlDoc.send("");
		  return xmlDoc.responseXML;
		
		} // end if

		alert("Error loading document");
		return null;
	}	
	
	function attachEventListener( elId, eventType, fn, useCapture )
	{
		var browser = detectBrowser();		
		var el = document.getElementById( elId );
		
		if ( el != null && browser == "IE" )
		{
			eventType = "on" + eventType;
			el.attachEvent( eventType, fn );
		} // end if

		else if ( el != null )
		{
			el.addEventListener( eventType, fn, useCapture );
			
		} // end else
		
		else
		{
			alert( "Error: Object is not attached to document." );
			return;
		}
				
	} // end attachEventListener()
	
	function doParse( txt )
	{
		var tokens	= [ "[br]" ];
		var resp = null;
		for ( var i = 0; i < tokens.length; i++ )
		{
			// <br>
			txt = txt.replace( /\[br\]/g, "<br/>" );				

			// <i>
			txt = txt.replace( /\[i\]/g, "<i>" );				
			txt = txt.replace( /\[_i\]/g, "</i>" );				

			// <u>
			txt = txt.replace( /\[u\]/g, "<u>" );				
			txt = txt.replace( /\[_u\]/g, "</u>" );				
			
			// <b>
			txt = txt.replace( /\[b\]/g, "<b>" );
			txt = txt.replace( /\[_b\]/g, "</b>" );
			
		} // end for
		
		return txt;
		
	} // end doParse()