/*

Name		spcTabs
Author		Mark de Jong (SPeLLCoDER)


*/

function TabStrip(settings)
{
	this.tabs			= [];
	this.tabIDcounter	= 0;
	this.tabsAmount	= 0;
	this.value = null;
	this.prevValue = null;

	// default settings
	this.config =
				{ singleselect:		true
				, btnclass:				'spctab'
				, btnclass_selected:	'spctabselected'
				, onchange:				null
				};

	// overwrite internal config with given settings
	for (settingname in settings) {
		this.config[settingname] = settings[settingname];
	}
	
	this.selectedItem		= -1;
	this.prevSelectedItem	= -1;
	
	this.wipe = function() {
		//	wipe all DOM element in the tabstrip
		var cont = this.config.usenode;

		while (cont.firstChild)
			cont.removeChild(cont.firstChild);

		//	wipe all data about the tabs	
		this.tabs = [];
	}

//	this.appendTo		= function(container) {
//		container.appendChild(this.container);
//	};
}

TabStrip.prototype.getValue = function()
{
	if (this.selectedItem==-1)
		return null;

	return this.tabs[this.selectedItem].value;
}

TabStrip.prototype.selectTab = function(number, fromtab)
{
	// FIXME: rethink for a better way to do this
	if (this.tabs[number].dontkeepfocus)
	{
		if (this.tabs[number].onselect)
			this.tabs[number].onselect();

		if (this.config.onchange)
			this.config.onchange();
			
		return;	
	}
	// if the tab informed us of selection, then don't call it again
	if (!fromtab)
		this.tabs[number].select();

	this.prevSelectedItem = this.selectedItem;
	this.prevValue = this.value;
	
	if (this.prevSelectedItem > -1) // && this.tabs[ tabList.prevSelectedItem ]) {
	{
		var tabref = this.tabs[this.prevSelectedItem];

		if (tabref.ondeselect)
			tabref.ondeselect();

		tabref.selected = false;

		removeClass(tabref.element, this.config.btnclass_selected);
	}

	var tabinstance = this.tabs[number];

	addClass(tabinstance.element, this.config.btnclass_selected);	

	this.selectedItem = number;
	this.value = this.getValue();
	
	if (tabinstance.onselect)
		tabinstance.onselect();
	
	if (this.config.onchange)
		this.config.onchange();
}

/* for singleselect=true will deselect the currently selected tab
for singleselect=false will deselect all selected tabs */
TabStrip.prototype.deselect = function()
{
	if (this.singleselect)
	{
		if (this.selectedItem > 0)
			this.tabs[this.selectedItem].deselect();

		this.selectedItem = -1;
		return;
	}
	
	tcount = this.tabs.length;
	while (tcount--)
		this.tabs.deselect();

	if (this.config.onchange)
		this.config.onchange();
}

TabStrip.prototype.destroy = function()
{
	// TODO
	// - remove reference from DOM elements (to break circular references)
}

TabStrip.prototype.createTab = function(settings)
{
	var newID = this.tabIDcounter++;
	
	this.tabs[newID]	= new TabButton();
	this.tabs[newID].key	= newID;
	this.tabs[newID].parent	= this;
	this.tabs[newID].value = settings.value;

	var tab = document.createElement('span');
	tab.className = this.config.btnclass;
	
	var tabL = document.createElement('span');
	tabL.className = 'tabLeft';
	var tabM = document.createElement('span');
	tabM.className = 'tabMiddle';
	var tabR = document.createElement('span');
	tabR.className = 'tabRight';

	tab.appendChild(tabL);
	tab.appendChild(tabM);
	tab.appendChild(tabR);

	if (settings.caption)
		tabM.appendChild(document.createTextNode(settings.caption));
		//tabM.innerHTML	= caption;

	if (settings.onselect)
		this.tabs[newID].onselect = settings.onselect;

	if (settings.ondeselect)
		this.tabs[newID].ondeselect = settings.ondeselect;	
		
	this.tabs[newID].element = tab;
//	this.tabs[newID].element.close = tl_closeTab;

	tab.instance = this.tabs[newID];
//	tab.onclick = function() { tl_doTab(tab.instance) };
	tab.onclick = this.tabs[newID].select;
	tab.onselectstart = new Function ("return false");		// prevent selection in IE
	this.config.usenode.appendChild(tab);

	if (settings.access) {

		addClass(tab.instance.element, settings.access);
	}

	this.tabsAmount++;

	
	return this.tabs[newID];
}

/* make a pre-existing element an tab */
TabStrip.prototype.hookTab = function(tabElement, caption, onselect, ondeselect, dontkeepfocus )
{
	this.hookTab2({ caption: caption, onselect: onselect, ondeselect: ondeselect, dontkeepfocus: dontkeepfocus, tabElement: tabElement })
}
TabStrip.prototype.hookTab2 = function(settings)
{
	if (typeof settings.tabElement == "undefined")
	{
		console.log("element for tab doesn't exist");
		return;
	};

	var newID = this.tabIDcounter++;

	var newTab = new TabButton(settings.caption);
	newTab.key		= newID;
	newTab.parent	= this;
	newTab.element	= settings.tabElement;
	newTab.value	= settings.value;
	newTab.onselect = settings.onselect;
	newTab.ondeselect = settings.ondeselect;	
	newTab.dontkeepfocus = settings.dontkeepfocus;

	this.tabs[newID] = newTab;
	
	if (settings.caption)
		tabM.appendChild(document.createTextNode(settings.caption));
		//tabM.innerHTML	= caption;
	
	settings.tabElement.instance = this.tabs[newID];
//	settings.tabElement.onclick = function() { tl_doTab(tab.instance) };
	settings.tabElement.onclick = this.tabs[newID].select;
	settings.tabElement.onselectstart = new Function ("return false");		// prevent selection in IE
	
	this.tabsAmount++;
	
	return this.tabs[newID];
}

TabStrip.prototype.closeTab = function(number, fromtab)
{
	console.log('Destroying tab with ID '+tab.key);

	if (!fromtab)
		tabList.tabs[ key ].close();

	if (number == this.selectedItem)
	{
		this.selectedItem = -1;
		if (this.config.onchange)
			this.config.onchange();
	}
	
	if (number == this.prevSelectedItem)
		this.prevSelectedItem = -1;

	//	remove instance (data) of the tab
	//	Find position in array and unset/remove the tab
	for (arrPos in this.tabs) {
		if ( tabList.tabs[ arrPos ].key == tab.key ) {
			this.tabs.splice( arrPos , 0 );
			break;
		}
	}

	this.tabsAmount--;
}

/*
selected
disabled
donttakefocus
*/
function TabButton() {
	this.selected		= false;
	this.disabled 		= false;	// FK Ongelukken Tab should be disabled (hidden) when users are not loggedin
	this.dontkeepfocus 	= false; // onselect will be called, but the tab won't recieve focus/active state (and ondeselect will never be called)
}

TabButton.prototype.close = function()
{
	var tab		= this;
	var tabList = tab.parent;

//	tabList.closeTab(this.key, true);

	tab.element.parentNode.removeChild( tab.element );	// remove tab-element from the DOM
}

TabButton.prototype.deselect = function()
{
	if (!this.selected)
		return;
	
	removeClass(this.element, this.parent.config.btnclass_selected);	

	if (this.ondeselect)
		this.ondeselect();

	this.parent.selectedItem = -1;
}

TabButton.prototype.select = function()
{
	if(this.instance == undefined)
	{
//		var tab = this.tabs[number];
//		var tabList = this;			// called from instance (this = instance_of_class)
		var tab = this;
		var tabList = this.parent;
	} else {
		var tab = this.instance;		// called from element (this = element)
		var tabList = tab.parent;
	}

	//console.log('previous: '+tabList.selectedItem+' - new: '+tab.key);
	
	//	Sanity checks
	if ( tab == undefined)
	{
		console.log("Tab to select doesn't exist.");
		return;
	}
	if ( tabList.prevSelectedItem > -1 && tabList.tabs[ tabList.prevSelectedItem ] == undefined )
	{
		console.log("The previously selected tab doesn't seem to exist anymore.");
		return;
	}


/*	if nothing has changed don't waste time updating the layout and
	also prevent losing our tabList.prevSelectedItem */
	if ( tabList.selectedItem == tab.key ) {
		//console.log('Selecting the allready selected tab.');
		return;
	}

	tabList.selectTab(tab.key, true);
	
	tab.selected = true;
}


function hasClass(ele,cls) {
	return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
}

function addClass(ele,cls) {
	if (!this.hasClass(ele,cls)) ele.className += " "+cls;
}

function removeClass(ele,cls) {
//	if (hasClass(ele,cls)) {
		var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
		ele.className=ele.className.replace(reg,' ');
//	}
}