/**
 * @author	Nerd Almighty
 * @copyright	2010 Bergwerk <http://bergwerk.forenberg.de/>
 * @license	Creative Commons - Attribution-Noncommercial-Share Alike 3.0 Unported <http://creativecommons.org/licenses/by-nc-sa/3.0/>
 */
var TabMenuBBCode = Class.create({
	/**
	 * Initialize the tabmenu bbcode functions (convert static content to real tabmenus, add eventlisteners, et cetera)
	 */
	initialize: function() {
		// get the outer div containers
		var tabMenus = $$('.tabMenuBBCodeStaticContent');
		
		// if there are no tab menus, we don't need to do anything
		if (tabMenus.size()) {
			// prepare tab menu count (used to generate unique ids)
			var tabMenuID = 0;
			
			tabMenus.each(function(container) {
				// increase id
				tabMenuID++;
				
				// prepare tab menu
				var tabMenu = new Element('div').addClassName('tabMenuBBCodeContent');

				// create tab list
				var tabList = new Element('ul').addClassName('tabMenuBBCodeTabList');
				var tabListContainer = new Element('div').addClassName('tabMenu').insert(tabList);
				tabMenu.insert(tabListContainer);
				
				// get tab data
				var staticTabs = container.select('.tabMenuBBCodeStaticTab').toArray();
				var tabCount = 0;
				for (var i = 0; i < staticTabs.length; i++) {
					// increase tab count
					tabCount++;
					var staticTab = staticTabs[i];
					
					// get icon, title and content
					var tabIcon = staticTab.select('h4 img')[0];
					var tabTitle = staticTab.select('h4 span')[0];
					var staticTabContent = staticTab.select('.tabMenuBBCodeStaticTabContent')[0];
					
					// create tab menu item
					var tab = new Element('li').addClassName('tabMenuBBCodeTab-' + tabMenuID);
					tabList.insert(tab);
					tab.id = 'tabMenuBBCodeTab-' + tabMenuID + '-' + tabCount;
					if (tabCount == 1) {
						// the first tab is active by default
						tab.addClassName('activeTabMenu');
					}
					var tabLink = new Element('a');
					tab.insert(tabLink);
					if (typeof tabIcon != 'undefined') {
						tabLink.insert(tabIcon);
						// if there's an icon in front of the title, we need an additional space
						tabLink.update(tabLink.innerHTML + ' ');
					}
					tabLink.insert(tabTitle);
					tabLink.observe('click', this.showTab.bindAsEventListener(this));

					// create sub tab menu
					var subTabListContainer = new Element('div').addClassName('subTabMenu tabMenuBBCodeSubTabMenu-' + tabMenuID);
					subTabListContainer.id = 'tabMenuBBCodeSubTabMenu-' + tabMenuID + '-' + tabCount;
					tabMenu.insert(subTabListContainer);
					var subTabListInnerContainer = new Element('div').addClassName('containerHead');
					subTabListContainer.insert(subTabListInnerContainer);
					
					// create content container
					var tabContentContainer = new Element('div').addClassName('border tabMenuContent tabMenuBBCodeTabContent-' + tabMenuID);
					tabContentContainer.id = 'tabMenuBBCodeTabContent-' + tabMenuID + '-' + tabCount;
					
					// hide tab content and sub tab menus
					if (tabCount != 1) {
						subTabListContainer.hide();
						tabContentContainer.hide();
					}
					
					if (staticTabContent.tagName == 'DIV') {
						// no sub tabs, insert the content right away
						var tabContent = staticTabContent.removeClassName('tabMenuBBCodeStaticTabContent containerContent').addClassName('container-1');
						tabContentContainer.insert(tabContent);
					}
					else if (staticTabContent.tagName == 'UL') {
						// create sub tab list
						var subTabList = new Element('ul').addClassName('tabMenuBBCodeSubTabList');
						subTabListInnerContainer.insert(subTabList);
						
						// get sub tab data
						var staticSubTabs = staticTabContent.select('.tabMenuBBCodeStaticSubTab').toArray();
						var subTabCount = 0;
						for (var j = 0; j < staticSubTabs.length; j++) {
							// increase sub tab count
							subTabCount++;
							var staticSubTab = staticSubTabs[j];
							
							// get icon, title and content
							var subTabIcon = staticSubTab.select('h5 img')[0];
							var subTabTitle = staticSubTab.select('h5 span')[0];
							var subTabContent = staticTab.select('.containerContent')[0];
							
							// create sub tab menu item
							var subTab = new Element('li').addClassName('tabMenuBBCodeSubTab-' + tabMenuID + '-' + tabCount);
							subTabList.insert(subTab);
							subTab.id = 'tabMenuBBCodeSubTab-' + tabMenuID + '-' + tabCount + '-' + subTabCount;
							if (subTabCount == 1) {
								// the first tab is active by default
								subTab.addClassName('activeSubTabMenu');
							}
							var subTabLink = new Element('a');
							subTab.insert(subTabLink);
							if (typeof subTabIcon != 'undefined') {
								subTabLink.insert(subTabIcon);
								// if there's an icon in front of the title, we need an additional space
								subTabLink.update(subTabLink.innerHTML + ' ');
							}
							subTabLink.insert(subTabTitle);
							subTabLink.observe('click', this.showSubTab.bindAsEventListener(this));
							
							// handle content
							subTabContent.removeClassName('containerContent');
							subTabContent.addClassName('tabMenuBBCodeSubTabContent-' + tabMenuID + '-' + tabCount + ' container-1');
							subTabContent.id = 'tabMenuBBCodeSubTabContent-' + tabMenuID + '-' + tabCount + '-' + subTabCount;
							tabContentContainer.insert(subTabContent);
							
							// hide sub tab content
							if (subTabCount != 1) {
								subTabContent.hide();
							}
						}
					}
					
					// add content
					tabMenu.insert(tabContentContainer);
				}
				
				// replace static content with actual tab menu
				tabMenu.id = 'tabMenuBBCodeContent-' + tabMenuID;
				container.replace(tabMenu)
			}.bind(this));
			
			// kill placeholders
			$$('.tabMenuBBCodePlaceholder').invoke('remove');
		}
	},
	
	/**
	 * Show the content of the requested tab, set it as active and hide any other content of this tab menu.
	 *
	 * @param	evt	EventObject
	 */
	showTab: function(evt) {
		// get tab menu and tab id from event element id
		var eventElement = evt.findElement().parentNode;
		if (eventElement.tagName == 'A') {
			eventElement = eventElement.parentNode;
		}
		var tabMenuID = eventElement.id.split('-')[1];
		var tabID = eventElement.id.split('-')[2];
		var tabMenu = $('tabMenuBBCodeContent-' + tabMenuID);	
		
		// hide all tab contents, all sub tab menus and reset the tabs
		tabMenu.select('.tabMenuBBCodeTabContent-' + tabMenuID + ', .tabMenuBBCodeSubTabMenu-' + tabMenuID).invoke('hide');
		tabMenu.select('.tabMenuBBCodeTab-' + tabMenuID).invoke('removeClassName', 'activeTabMenu');
		
		// show the content and sub tab menu of the requested tab and set it as active
		$('tabMenuBBCodeTab-' + tabMenuID + '-' + tabID).addClassName('activeTabMenu');
		$('tabMenuBBCodeSubTabMenu-' + tabMenuID + '-' + tabID).show();
		$('tabMenuBBCodeTabContent-' + tabMenuID + '-' + tabID).show();
	},
	
	/**
	 * Show the content of the requested sub tab, set it as active and hide any other content of this tab menu.
	 *
	 * @param	evt	EventObject
	 */
	showSubTab: function(evt) {
		// get tab menu and tab id from event element id
		var eventElement = evt.findElement().parentNode;
		if (eventElement.tagName == 'A') {
			eventElement = eventElement.parentNode;
		}
		var tabMenuID = eventElement.id.split('-')[1];
		var tabID = eventElement.id.split('-')[2];
		var subTabID = eventElement.id.split('-')[3];
		var tabMenu = $('tabMenuBBCodeContent-' + tabMenuID);	
		
		// hide all sub tab contents, and reset the sub tabs
		tabMenu.select('.tabMenuBBCodeSubTabContent-' + tabMenuID + '-' + tabID).invoke('hide');
		tabMenu.select('.tabMenuBBCodeSubTab-' + tabMenuID + '-' + tabID).invoke('removeClassName', 'activeSubTabMenu');
		
		// show the content of the requested sub tab and set it as active
		$('tabMenuBBCodeSubTab-' + tabMenuID + '-' + tabID + '-' + subTabID).addClassName('activeSubTabMenu');
		$('tabMenuBBCodeSubTabContent-' + tabMenuID + '-' + tabID + '-' + subTabID).show();
	}
});
