/*
 * var options = {
 * 		tabsBoxId: 'id',						Exemple: onglets-box
 * 		tabsBoxClassName: 'className',			Exemple: onglet_[nb]
 * 		tabClassName: 'className',				Exemple: onglet
 * 		tabActiveClassName: 'className',		Exemple: active
 * 		tabElement: 'elementName',				Exemple: h2
 * 		contentClassName: 'className',			Exemple: onglet-contenu
 * 		contentNoTabClassName: 'className',		Exemple: onglet-sans-contenu
 * 		tabHtml: 'html',						Exemple: <span>[html]</span>			
 * 		contentHtml: 'html',					Exemple: [html]<div class="onglet-contenu-bas"></div>
 * 		contentNoTabHtml: 'html',				Exemple: [html]<div class="onglet-sans-contenu-bas"></div>
 * }
 *
 * Dans les options de type "html", les variables suivantes peuvent être utilisées :
 * [html]		est remplacée par le contenu normalement inséré (nom de l'onglet ou contenu de l'onglet)
 * [index]		est remplacée par l'index de l'onglet (1 pour le premier onglet, 2 pour le suivant, etc.) /!\ N'est pas remplacé dans contentNoTabHtml
 * [oindex]		est remplacée par l'index du groupe d'onglets (1 pour le premier groupe d'onglets, 2 pour le suivant, etc.)
 */


/**
 * @var (int) Index du groupe d'onglets
 */
var RSPlug_Tab_Index = 0;
var RSPlug_Tab_ongletsID = {};

/**
 * Objet de génération d'onglets
 * @param mixed container		Conteneur à analyser (peut-être un id ou un objet)
 * @param object options		Contient les options
 */
var RSPlug_Tab = function (container, options){
	// Incrémentation de l'index du groupe d'onglets
	RSPlug_Tab_Index++;	
	
	// Initialisation de la configuration
	this._config = {};
	this._config.tabsBoxId 				= (options.tabsBoxId && options.tabsBoxId != '') 							? options.tabsBoxId 				: 'onglets-box' + RSPlug_Tab_Index;
	this._config.tabsBoxClassName		= (options.tabsBoxClassName && options.tabsBoxClassName != '') 				? options.tabsBoxClassName			: '';
	this._config.tabClassName 			= (options.tabClassName && options.tabClassName != '') 						? options.tabClassName 				: 'onglet';
	this._config.firstTabClassName 		= (options.firstTabClassName && options.firstTabClassName != '') 			? options.firstTabClassName 		: 'premier-onglet';
	this._config.lastTabClassName 		= (options.lastTabClassName && options.lastTabClassName != '') 				? options.lastTabClassName 			: 'dernier-onglet';
	this._config.tabActiveClassName 	= (options.tabActiveClassName && options.tabActiveClassName != '') 			? options.tabActiveClassName 		: 'active';
	this._config.tabElement 			= (options.tabElement && options.tabElement != '') 							? options.tabElement.toLowerCase() 	: 'h2';
	this._config.contentClassName 		= (options.contentClassName && options.contentClassName != '') 				? options.contentClassName 			: 'onglet-contenu';
	this._config.contentNoTabClassName 	= (options.contentNoTabClassName && options.contentNoTabClassName != '') 	? options.contentNoTabClassName 	: 'onglet-sans-contenu';
	this._config.tabHtml 				= (options.tabHtml && options.tabHtml != '') 								? options.tabHtml 					: '[html]';
	this._config.contentHtml 			= (options.contentHtml && options.contentHtml != '') 						? options.contentHtml 				: '[html]';
	this._config.contentNoTabHtml		= (options.contentNoTabHtml && options.contentNoTabHtml != '') 				? options.contentNoTabHtml			: '[html]';
	this._config.addHash				= (null !== options.addHash && undefined !== options.addHash)				? (options.addHash ? true : false)	: false;
	this._config.callbackCannotChange	= (null !== options.callbackCannotChange && typeof(options.callbackCannotChange) == 'function')	? (options.callbackCannotChange)	: null;
	this._config.callbackTryChange		= (null !== options.callbackTryChange && undefined !== options.callbackTryChange && typeof(options.callbackTryChange) == 'function')	? (options.callbackTryChange)	: null;
	if (null !== options.openFirstTab && undefined !== options.openFirstTab && !options.openFirstTab){
		this._config.openFirstTab = false;
	} else {
		this._config.openFirstTab = true;
	}
	
	this.blinkStarted = false;
	
	// Peut-on changer d'onglet ?
	this.allowChangeTab = true;
	
	// On récupère le conteneur des tabs
	var _container = (typeof container == 'string') ? document.getElementById(container) : container;
	
	if (_container){
		
		// Initialisation des conteneurs
		var _tmpTabs = document.createElement('div');
		_tmpTabs.innerHTML = _container.innerHTML; 	
		_container.innerHTML = '';
		_container.className = '';
		var _tabsBox = document.createElement('div');
		_tabsBox.id = this._config.tabsBoxId;
		_container.appendChild(_tabsBox);
		
		// Analyse du contenu
		var childs = _tmpTabs.childNodes;
		var indexTab = 0;
		this.tabActif = null;
		var hasContent = false;
		var lastTab = null;
		var hasTab = false;
		for (var i=0; i<childs.length; i++){
			if (childs[i].nodeType == 1){
				if (childs[i].nodeName.toLowerCase() == this._config.tabElement){
					hasTab = true;
					indexTab++;
					var tab = document.createElement('a');
					lastTab = tab;
					tab.href = '#';
					tab.className = this._config.tabClassName;
					if (indexTab == 1){
						this.addClassName(tab, this._config.firstTabClassName);
					}
					tab.innerHTML = this.replaceVars(this._config.tabHtml, {html: childs[i].innerHTML, index: indexTab, oindex: RSPlug_Tab_Index})
					tab.id = 'tab_' + RSPlug_Tab_Index + '-' + indexTab;
					if (null !== childs[i].id && undefined !== childs[i].id && childs[i].id != ''){
						// Si l'élement avait un ID, on l'associe à cet onglet
						RSPlug_Tab_ongletsID['id_'+childs[i].id] = tab.id; 
						tab.rel = childs[i].id;
					}
					// Et on associe aussi l'id réel de l'onglet
					RSPlug_Tab_ongletsID['id_'+tab.id] = tab.id;

					var addHash = (this._config.addHash);
					
					var inst = this;
					tab.onclick = function(){
						if (typeof(inst._config.callbackTryChange) == 'function'){
							if (false === inst._config.callbackTryChange(inst, this)){
								return false;
							}
						}
						/*
						if (!inst.allowChangeTab){
							if (typeof(inst._config.callbackCannotChange) == 'function'){
								inst._config.callbackCannotChange(inst, tab);
							}
							return false;
						}
						*/
						if (inst.tabActif != null){
							inst.removeClassName(inst.tabActif, inst._config.tabActiveClassName);
							var index = inst.tabActif.id.substr(inst.tabActif.id.lastIndexOf('_') +1);
							if (document.getElementById('tab-contenu_' + index)){
								document.getElementById('tab-contenu_' + index).style.display = 'none';
							}
						}
						inst.tabActif = this;
						inst.addClassName(this, inst._config.tabActiveClassName);
						var index = this.id.substr(this.id.lastIndexOf('_') +1);
						document.getElementById('tab-contenu_' + index).style.display = '';
						this.blur();
						if (addHash){
							location.replace('#' + ((null !== this.rel && this.rel != '') ? this.rel : this.id));
						}
						return false;
					};
					
					if (this.tabActif == null && this._config.openFirstTab){
						this.tabActif = tab;
						inst.addClassName(tab, this._config.tabActiveClassName);
					}
					_tabsBox.appendChild(tab);
					
					var tabContenu = document.createElement('div');
					tabContenu.style.display = (indexTab == 1 && this._config.openFirstTab) ? '' : 'none';
					tabContenu.id = 'tab-contenu_' + RSPlug_Tab_Index + '-' + indexTab;
					tabContenu.className = this._config.contentClassName;
					tabContenu.innerHTML = '&nbsp;';
					_container.appendChild(tabContenu);
					var enfant = null;
				}
				else {
					hasContent = true;
					var enfant = childs[i].cloneNode(true);
					var elmt = document.getElementById('tab-contenu_' + RSPlug_Tab_Index + '-' + indexTab);
					if (indexTab != 0 && elmt){
						if (elmt.innerHTML == '&nbsp;'){
							elmt.innerHTML = '';
						}
						elmt.appendChild(enfant);
					}
				} 			
			}
			else if (childs[i].nodeType == 3 && childs[i].nodeValue.replace(/^\s+/, '').replace(/\s+$/, '') != ''){
				hasContent = true;
				if (hasTab){
					//var enfant = document.createElement('p');
					//var string = ''+(childs[i].nodeValue ? childs[i].nodeValue.replace(/(^\s+|\s+$)/g, '') : '');
					var enfant = childs[i].cloneNode(true);
					//enfant.innerHTML = string;
					
					
					var elmt = document.getElementById('tab-contenu_' + RSPlug_Tab_Index + '-' + indexTab);
					if (indexTab != 0 && elmt){
						if (elmt.innerHTML == '&nbsp;'){
							elmt.innerHTML = '';
						}
						elmt.appendChild(enfant);
					} 
				}
			}
		}
		if (null !== lastTab){
			this.addClassName(lastTab, this._config.lastTabClassName);
		}
		if (indexTab == 0){
			if (hasContent){
				var content = document.createElement('div');
				content.className = this._config.contentNoTabClassName;
				content.innerHTML = this.replaceVars(this._config.contentNoTabHtml, {html: _tmpTabs.innerHTML, oindex: RSPlug_Tab_Index});
				_container.removeChild(_tabsBox);
				_container.appendChild(content);
			} else {
				_container.parentNode.removeChild(_container);
			}
		} else {
			for (var i=0; i<=indexTab; i++){
				var elmt = document.getElementById('tab-contenu_' + RSPlug_Tab_Index + '-' + i);
				if (elmt){
					elmt.innerHTML = this.replaceVars(this._config.contentHtml, {html: elmt.innerHTML, index: i, oindex: RSPlug_Tab_Index});
				}
			}
			if (_tabsBox && this._config.tabsBoxClassName != ''){
				_tabsBox.className = this.replaceVars(this._config.tabsBoxClassName, {nb: indexTab});
			}
		}
	}
};

RSPlug_Tab.openTab = function (tabId){
	if (tabId.substr(0, 1) == '#'){
		tabId = tabId.substr(1);
	}
	if (RSPlug_Tab_ongletsID['id_'+tabId] && document.getElementById(RSPlug_Tab_ongletsID['id_'+tabId])){
		var objParent = document.getElementById(RSPlug_Tab_ongletsID['id_'+tabId]).parentNode;
		while (true && objParent){
			if (objParent.className == 'onglet-contenu'){
				var id = 'tab_' + objParent.id.substr(12);
				RSPlug_Tab.openTab(id);
				/*if (document.getElementById(id)){
					document.getElementById(id).onclick();
				}*/
				break;
			}
			if (objParent.nodeName == 'body'){
				break; 
			}
			objParent = objParent.parentNode;
		}
		if (document.getElementById(RSPlug_Tab_ongletsID['id_'+tabId])){
			document.getElementById(RSPlug_Tab_ongletsID['id_'+tabId]).onclick();
		}
	}
};

RSPlug_Tab.prototype.blinkActif = function (){
	if (null !== this.tabActif && !this.blinkStarted){
		this.blinkStarted = true; 
		this.addClassName(this.tabActif, 'blink');
		var inst = this;
		setTimeout(function(){ inst.removeClassName(inst.tabActif, 'blink'); }, 100);
		setTimeout(function(){ inst.addClassName(inst.tabActif, 'blink'); }, 250);
		setTimeout(function(){ inst.removeClassName(inst.tabActif, 'blink'); inst.blinkStarted = false; }, 350);
		setTimeout(function(){ inst.addClassName(inst.tabActif, 'blink'); }, 500);
		setTimeout(function(){ inst.removeClassName(inst.tabActif, 'blink'); inst.blinkStarted = false; }, 600);
	}
};

RSPlug_Tab.prototype.replaceVars = function (string, vars){
	for (myVar in vars){
		var reg = new RegExp('\\\[' + myVar + '\\\]', '');
		string = string.replace(reg, vars[myVar]);
	}
	return string;
};

RSPlug_Tab.prototype.hasClassName = function (element, className){
	if (typeof element == 'string') element = document.getElementById(element);
	var classes = element.className.split(/\s+/);
	for (var i=0; i<classes.length; i++){
		if (classes[i] == className){
			return true;
		}
	}
	return false;
};

RSPlug_Tab.prototype.removeClassName = function (element, className){
	if (typeof element == 'string') element = document.getElementById(element);
	if (element){
		var classes = element.className.split(/\s+/);
		element.className = '';
		for (var i=0; i<classes.length; i++){
			if (classes[i] != className){
				element.className += (element.className == '' ? '' : ' ') + classes[i];
			}
		}
	}
};

RSPlug_Tab.prototype.addClassName = function (element, className){
	if (typeof element == 'string') element = document.getElementById(element);
	if (element && !this.hasClassName(element, className)){
		element.className += (element.className == '' ? '' : ' ') + className;
	}
};