<?xml version="1.0" encoding="utf-8" ?> 
<application-components>
	<application-component id = "tabstrip" participant-id = "printer-friendly">
		<![CDATA[
		component_init : function(){
			this.getPointers().tabs = [];
			this.createHandler("tabclick",0,0,1);
			
			var strip = document.createElement("div");
			var oC = this.getContainer();
			if(oC.firstChild) oC.insertBefore(strip,oC.firstChild);
			else oC.appendChild(strip);
			this.getPointers().tab_strip = strip;
			/*strip.style.clear = "both";*/
			strip.className += " tabstrip";
			this.SetupTabs();
			if(this.getPointers().tabs.length) this.ShowTab(0);
		},
		component_destroy : function(){
			this.getPointers().tabs = 0;
			this._prehandle_tabclick = 0;
			this.getPointers().tab_strip = 0;
		},
		SetupTabs : function(){
			var a = this.getContainer().childNodes, ha;
			for(var i = 0; i < a.length; i++){
				if(a[i].nodeType == 1 && (ha = a[i].getElementsByTagName("h2")).length){
					ha = ha[0];
					this.AddTab(org.cote.js.xml.getInnerText(ha),a[i]);
				}
			}
			if(this.getContainer().getAttribute("printer-friendly") == "1"){
				this.AddTab("Printer Friendly",0);
			}
		},
		AddTab : function(tabName, pane){
			var tabs = this.getPointers().tabs;

			var o = 0,p,l=tabs.length;

			var tab = tabs[l] = {index:(pane ? l : -1),tab:0,pane:pane};
			o = document.createElement("div");
			o.appendChild(document.createTextNode(tabName));
			o.className = "tab";
			o.onclick = this._prehandle_tabclick;
			o.tab_index = (pane ? l : -1);
			
			this.getPointers().tab_strip.appendChild(o);
			tab.tab = o;
			if(pane){
				pane.style.display = "none";
				pane.className += " tab_pane";
			}
			//pane.style.clear = "both";

		},
		_handle_tabclick : function(e){
			var o = org.cote.js.dom.event._gevt_src(e);
			if(o && typeof o.tab_index == "number"){
				if(o.tab_index >= 0) this.ShowTab(o.tab_index);
				else this.ShowPrinterFriendly();
				
			}
			
		},
		ShowPrinterFriendly : function(){
			var tabs = this.getPointers().tabs;
			this.getPointers().tab_strip.style.display = "none";
			for(var i = 0; i < tabs.length; i++){
				if(!tabs[i].tab || !tabs[i].pane) continue;
				tabs[i].pane.style.display = "block";
				tabs[i].pane.className = tabs[i].pane.className.replace(/tab_pane/gi,"");
			}
			this.serveTransaction('printerfriendly');
		},
		ShowTab : function(ti){

			var tabs = this.getPointers().tabs;
			if(ti < 0 || ti >= tabs.length) return;
			for(var i = 0; i < tabs.length; i++){
				if(!tabs[i].tab || !tabs[i].pane) continue;
				if(ti == i){
					tabs[i].pane.style.display = "block";
					tabs[i].tab.className = "tab tab_active";				
				}
				else{
					tabs[i].pane.style.display = "none";
					tabs[i].tab.className = "tab";
				}
			}
		}
		]]>
	</application-component>
</application-components>