/**
* Released under the terms or MIT license:
*
* Copyright (c) Bajcic Dragan
* 
* Permission is hereby granted, free of charge, to any person obtaining a copy 
* of this software and associated documentation files (the "Software"), to deal 
* in the Software without restriction, including without limitation the rights 
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 
* copies of the Software, and to permit persons to whom the Software is 
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in all 
* copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 
* SOFTWARE.
*/

var KeepTabs = Class.create({
  
	initialize: function(container, options) {

		this.options    = Object.extend({
			tabsSelector:       'div.keep-tab',
            titleSelector:      'h5',
            tabsNavClass:		'tabs-navigation',
            buttonClass:    	'button-tab',
			buttonClassActive:	'button-tab-active',
			closeTab			:false,
			closeTabLabel	    :'close',
			closeTabClass       :'close-tab'
        }, options || {});

		this.container  	= $(container);
		this.tabs 			= this.container.select(this.options.tabsSelector);
		this.clearTabs();
		this.addTabs();
		
  	},
	
	clearTabs: function() {
		this.tabs.each(function(element){
			element.hide();
		});
	},
	
	makeActive: function(index){
			
		this.tabs[index].show();
				
		this.buttons.each(function(el){		
			if (el.hasClassName(this.options.buttonClassActive)) {
				el.removeClassName(this.options.buttonClassActive);			
			}		
		}.bind(this));
		
		this.buttons[index].addClassName(this.options.buttonClassActive);
	},
	
	addTabs: function(){
		
		this.tabNav = new Element('div', { 'class': this.options.tabsNavClass });	
		this.container.insert({ top: this.tabNav });
		
		this.buttons 	= [];
		this.closeTabs	= [];
		
		this.tabs.each(function(el,index){
				
			var tabTitle = el.down(this.options.titleSelector);
			tabTitle.hide();
					
			this.buttons[index] = new Element('div', { 'class': this.options.buttonClass }).update(tabTitle.innerHTML);		
			this.tabNav.insert(this.buttons[index]);			
			Event.observe(this.buttons[index], 'click', function() {
				this.clearTabs();
			    this.makeActive(index);
			}.bind(this));
			
			if (this.options.closeTab) {
				this.closeTabs[index] = new Element('div', { 'class': this.options.closeTabClass }).update(this.options.closeTabLabel);
				el.insert({ bottom: this.closeTabs[index] });					
				Event.observe(this.closeTabs[index], 'click', function() {
					this.clearTabs();
					this.buttons.each(function(el){		
						if (el.hasClassName(this.options.buttonClassActive)) {
							el.removeClassName(this.options.buttonClassActive);			
						}		
					}.bind(this));
				}.bind(this));				
			}
		
		}.bind(this));	
	
	}
	
});