// JSBASE tabs v0.3.0 by Sebastian P. Wolbring - http://www.ccsmedia.de
// licensed under The MIT License
// Copyright (c) 2008 Sebastian Peter Wolbring
// for details see license.txt

	var JSBASE = {};
	
	JSBASE.DOM = {};
	
	JSBASE.DOM.prevDefault = function (ev) {
	    if (document.body.addEventListener) {
	        ev.preventDefault();
	    } else if (document.body.attachEvent) {
			ev.returnValue = false;
	    } 
	};
	
	JSBASE.DOM.getTarget = function (ev) {
		var targ;
		if (!ev) { var ev = window.event; }
		if (ev.target) { targ = ev.target; } else if (ev.srcElement) { targ = ev.srcElement; }
		// defeat Safari bug
		if (targ.nodeType == 3) { targ = targ.parentNode; }
		return targ;		
	};
	
	JSBASE.DOM.addEvent = function (elm, eventType, listenerFunction, useCapture) {
	    if (elm.addEventListener) {
	        elm.addEventListener(eventType, listenerFunction, useCapture);
	    } else if (elm.attachEvent) {
	        elm.attachEvent('on' + eventType, listenerFunction);
	    } else {
	        elm['on' + eventType] = listenerFunction; // should return false to prevent standard action of a link (e.g.)
	    }
	};
	
	JSBASE.widget = {};
	JSBASE.widget.tabs = function () {
		// check browser JS support
		if(!document.getElementById || !document.getElementsByTagName || !document.createTextNode) {return;}
		
		var containerDiv;
		var contentElms;
		var tabElms = new Array();
		var formerActiveTab;
		var formerActiveContent;
		var clickedTab;
		var clickedTabsContent;
		
		//TODO: implement Ajax content loading
		//TODO: comment me (usage of the next 3 lines)
		var clickedTabCounter = new Array();
		var RELOAD_USING_AJAX = false; // please do not change -> Ajax content loading is not yet implemented
		var NUMBER_OF_CLICKS_BEFORE_USING_AJAX = 0; // please do not change -> Ajax content loading is not yet implemented
		
		var DEFAULT_TAB_CLASS = "jsbaseTabSwitch";
		var ACTIVE_TAB_CLASS = "tabActive";
		var DEFAULT_CONTENT_CLASS = "jsbaseTabContent";
		var ACTIVE_CONTENT_CLASS = "contentActive";

		// the that var must be filled in the constructor / init function because at this point here the "this" points to the window object
		var that;

		return {
			init : function (idOfContainerDiv) {
				// initialise the root container div of this tabs instance
				containerDiv = $(idOfContainerDiv);
				// set the initial value of "that" right now because in this constructor the "this" points to its corresponding object (instance)//TODO: really to its instance?? or to its prototype?? -> test!!
				that = this;
				// prepare all tab links
				that.prepareTabsAndContent();
			},
			
			getContainerDiv : function () {
				return containerDiv.readAttribute("id");
			},
			
			prepareTabsAndContent : function () {
				switchElms = $$('#' + containerDiv.readAttribute("id") + ' > .jsbaseTabSwitch a');
				contentElms = $$('#' + containerDiv.readAttribute("id") + ' > .jsbaseTabContent');
				for (i=0; i < switchElms.length; i++) {
					// assign ids to the name attribute of each tab switch and content div
					switchElms[i].writeAttribute("name", i);
					contentElms[i].writeAttribute("name", i);
					JSBASE.DOM.addEvent(switchElms[i], "click", that.switchTab, false);
				}
				that.initFormerActiveTab();
			},
			
			initFormerActiveTab : function () {
				var numElm = $$('#' + containerDiv.readAttribute("id") + ' > .tabActive a');
				var num = numElm[0].readAttribute("name");
				formerActiveTab = switchElms[num];
				that.initFormerActiveContent(num);
			},
			
			initFormerActiveContent : function (num) {
				formerActiveContent = contentElms[num];
			},
			
			switchTab : function (e) {
				JSBASE.DOM.prevDefault(e);
				var targ = JSBASE.DOM.getTarget(e);
				
				clickedTab = targ;
				clickedTabParent = $(clickedTab.parentNode);
				formerActiveTabParent = $(formerActiveTab.parentNode);
				
				// use the clickedTabs name attribute value to get access to its corresponding content div 
				clickedTabsContent = $$('#' + containerDiv.readAttribute("id") + ' > .jsbaseTabContent[name=' + clickedTab.readAttribute("name") + ']');
				clickedTabsContent = clickedTabsContent[0];
				that.manipulateClasses();
			},
			
			manipulateTabs : function () {
				formerActiveTab.parentNode.writeAttribute("class", DEFAULT_TAB_CLASS);
				clickedTabParent.writeAttribute("class", DEFAULT_TAB_CLASS + " " + ACTIVE_TAB_CLASS);
			},
			
			manipulateContent : function () {
				if (!RELOAD_USING_AJAX) {
					that.manipulateContentWithoutAjax();
				} else if (RELOAD_USING_AJAX && (clickedTabCounter[clickedTab.readAttribute("name")] < NUMBER_OF_CLICKS_BEFORE_USING_AJAX)) {
					that.manipulateContentWithoutAjax();
				} else {
					that.manipulateContentUsingAjax();
				}
			},
			
			manipulateContentUsingAjax : function () {
				alert("Sorry, not yet implemented...");
			},

			manipulateContentWithoutAjax : function () {
				formerActiveContent.writeAttribute("class", DEFAULT_CONTENT_CLASS);
				clickedTabsContent.writeAttribute("class", DEFAULT_CONTENT_CLASS + " " + ACTIVE_CONTENT_CLASS);
			},
			
			manipulateClasses : function () {
				that.raiseClickedTabCounter();
				if(formerActiveTab != clickedTab) {
					// manipulate classes of tabs and corresponding content divs
					that.manipulateTabs();
					// TODO: the manipulation of content should also be done if formerActiveTab == clickedTab when using AJAX
					that.manipulateContent();
					// afterwards set new values for the "former..." vars
					formerActiveTab = clickedTab;
					formerActiveContent = clickedTabsContent;
				}
			},
			
			raiseClickedTabCounter : function () {
				if(typeof(clickedTabCounter[clickedTab.readAttribute("name")]) !== "undefined") {
					clickedTabCounter[clickedTab.readAttribute("name")] += 1;
				} else {
					clickedTabCounter[clickedTab.readAttribute("name")] = 0;
				}
			}
		}
	};
