
// xhtml degrabable tabs for tsh
// by tim scarfe, developer-x.com
// webmaster@developer-x.com
// started - 14:00 22/12/2001
// updated - 00:53 12/02/2002
// time spent - 10 hours  


  /*
  /
  / 	to-do list/done/notes
  /
  /	add anim functionality for aaron (wanna do this aaron?) **use yp accemilation**
  / 	add method to undo all changes and make basic text again ** do this **
  / 	fix :hover css issue *done*
  / 	fix l146 issue ***FIXED*** (15:20 20/01/2002)  
  /	fix 3 point issue with standards detection *done*
  /	block ie5 from rendering tabs, find a standard it doesnt support :) (done 00:54 10/02/2002 shitlist added temp)
  / 	events use prop system/literal functions, do something? (done 12:02 09/02/2002)
  /	(20:27 11/02/2002) javascript: pseudos, hmmm./. whatcha think? node.removeAttribute fucks IE
  /	(20:28 11/02/2002) #id hopping added
  /	now cloning title attribs on tabs
*/



//  tabsystem . customise

tabSystem.classTrigger = "tabsystem";
tabSystem.tabClass = "tabcont";
tabSystem.contHeadClass = "contHead";
tabSystem.activeTabClass = "activeTab";
tabSystem.startIndex = 0;
tabSystem.enableIndexing = 1;
tabSystem.ulContainerClass="tabul";

// (20:38 10/02/2002) trying this standards thing out as literal for 3-points, use of eval is a bummer :(

tabSystem.standards = [ "document.getElementById",
		"document.getElementsByTagName",
		"Array.prototype.push",
		"document.body",
		"document.createElement",
		"navigator.userAgent",
		"window.location.href" ]

// msie5.0 has the dom capability but not the css capability, dilemma huh?
// ok, fixed the above issue, but ie5 *does* have enough css for inline LIs.. :) shit.

tabSystem.userAgentShitList = [ "MSIE 5.0" ] // take this out??

tabSystem.instances = []

tabSystem.construct = function construct( e ) {

	for(var x=0;x<tabSystem.standards.length;x++) {

		if(! eval(tabSystem.standards[ x ]) ) return;
	}

	for(var x=0;x<tabSystem.userAgentShitList.length;x++) {

		if( navigator.userAgent.search(  
				tabSystem.userAgentShitList[ x ]  
				) != -1 ) return;
	}

	var tabSystems = document.getElementsByClassName(  
					document, tabSystem.classTrigger  
					)
		
	for(var x=0;x<tabSystems[ tabSystem.classTrigger ].length;x++) {

		new tabSystem(  
			tabSystems[ tabSystem.classTrigger ][ x ]  
			)
	}
}

function tabSystem( el ) { // clean this all up a bit

	tabSystem.instances.push( this );

	this.el = el;
	this.tabs=[]
	this.nodes = []
	this.tabNames=[]

	this.kids = document.getElementsByClassName(  
			this.el, tabSystem.tabClass
			)

	this.buildTabs = function buildTabs( e ) {

		var tabs = this.kids

		// ohh my god, what a good idea, uls..		

		this.ulCont = document.createElement("div")

		this.ulCont.setAttribute("class", "ulCont")

		this.ul = document.createElement("UL")

		this.ul.setAttribute("class","tabul")

		this.ulCont.appendChild( this.ul )

		this.el.parentNode.insertBefore( this.ulCont, this.el )
			
		for(var x=0;x<tabs[tabSystem.tabClass].length;x++) { // for each tab

			var t = tabs[tabSystem.tabClass][x].getElementsByTagName(
					"H1"
					)[ 0 ].childNodes[0].nodeValue

			this.tabNames.push([x,t])

			// remove origional element
			
			this.nodes.push( tabs[tabSystem.tabClass][x].getElementsByTagName(
					"H1"
					)[ 0 ].cloneNode( 1 ) ) // clone for doing whatever


			tabs[tabSystem.tabClass][ x ].removeChild(
				tabs[tabSystem.tabClass][x].getElementsByTagName(
					"H1"
					)[ 0 ]
    				)

			var newTabNode = document.createElement("A")

			//***hack***

			// Is it a safe bet that browsers that get this far support javascript pseudos?
			// remember js ps are not designed for this return false shit, they are for writing data to new documents
			// onclick it?

			//newTabNode.removeAttribute("href","") // causes ie to stop hovering tabs

			newTabNode.setAttribute("href","javascript://")  

			var atext = document.createTextNode( t ) /*get tab text*/

			newTabNode.appendChild( atext )

			newTabNode.setAttribute( "title",  
					this.nodes[this.nodes.length-1].getAttribute("title")  
					)

			var li = document.createElement("L1")

			li.appendChild( newTabNode )

			this.ul.appendChild( li )

			this.tabs.push(
				 newTabNode
			)

			this.tabs[this.tabs.length-1].className = "tabstyle"
				
			// insert new heading to prefix content

			// we have to remove the heading and re-insert it because IE blows

			var h = document.createElement("H1")

			h.appendChild( document.createTextNode( t ) )
			h.setAttribute("class", tabSystem.contHeadClass )

			var el = tabs[tabSystem.tabClass][ x ].insertBefore(  
						h, tabs[tabSystem.tabClass][ x ].firstChild   
						)

		}

		this.built = 1;
	}

	this.buildTabs( )

	this.switchtab = function switchtab( e ) {

		// hide all cont, then show required

		this.setActs = function setActs( e ) {

			for(var x=0;x<this.tabs.length;x++) {

				this.tabs[ x ].activeTab=0;
			}			
		
			this.tabs[ e ].activeTab = 1;
		}

		this.setActs( e )

		var tabs = this.kids

		for(var x=0;x<this.tabs.length;x++) { // for each tab

			if(this.tabs[x].activeTab) this.tabs[ x ].className += " " + tabSystem.activeTabClass;

				else this.tabs[ x ].className = "tabstyle";

			tabs[tabSystem.tabClass][ x ].style.display = "none";
		}

		tabs[tabSystem.tabClass][ e ].style.display = "block";

		// add events

		this.addevents( );
	}

	this.addevents = function addevnt( e ) {

		for(var x=0;x<this.tabs.length;x++) {
				
			if( ! this.tabs[x].activeTab ) this.tabs[x].onclick = new Function (
					"tabSystem.instances["+ this.getInstance( ) +"].clicked("+ x +")"
					)

				else this.tabs[x].onclick = function( e ) {

					this.blur( )
				}
		}		
	}

	this.clicked = function clicked( e, t ) {
			
		this.tabs[e].blur( );

		this.tabs[e].className += " " + tabSystem.activeTabClass;

		this.switchtab( e );
	}

	this.getInstance = function getins( e ) {

		for(var x=0;x<tabSystem.instances.length;x++) {

			if( tabSystem.instances[x]==this ) return ( x );
		}
	}

	this.getTabIndexByName = function( s ) {

		for(var x=0;x<this.tabNames.length;x++) {

			if( this.tabNames[ x ][ 1 ] == s ) return( this.tabNames[ x ][ 0 ] )
		}  
		
		return ( 0 );
	}

	this.doIndex = function doIndx( e ) {

		if( String( window.location.href ).search(/#/)!=-1 ) {

			var request = window.location.href.match(/#.+/)[0].replace(/#/,"")

			this.switchtab( this.getTabIndexByName( request ) );
		}

		else this.switchtab( tabSystem.startIndex );
	}

	if ( tabSystem.enableIndexing ) this.doIndex( )
}

tabSystem.construct( );

