﻿var mootabs = new Class({
  Implements: [Options, Events],
  options: {
    width:            '100%',
    height:           '650px',
    changeEvent:      'click', 
		changeTransition: Fx.Transitions.Bounce.easeOut,
    duration:         1000,
    mouseOverClass:   'active',
    activateOnLoad:   'first',
    useAjax:          false,
    ajaxUrl:          '',
    ajaxOptions:      { method:'get' },
    ajaxLoadingText:  'Loading...',
    cookieName:       'MooTabsActiveTab',
		cookiePath:       '/'
  },
  
  initialize: function( element , options ){
    this.setOptions( options );
    this.el = $( element );
    this.elid = element;
    this.el.setStyles({
      height: this.options.height,
      width: this.options.width
    });
    this.titles = $$( '#' + this.elid + ' ul.mootabs-titles li.mootabs-title' );
		this.links = $$( '#' + this.elid + ' ul.mootabs-links li.mootabs-link' );
    this.panelHeight = this.el.getSize().y - ( this.titles[0].getSize().y );
    this.panels = $$( '#' + this.elid + ' ul.mootabs-panels li.mootabs-panel' );
		if( this.panelHeight > 0 ) {
			this.panels.setStyle( 'height' , this.panelHeight );
		}
    this.titles.each( function( item ) {
			switch( this.options.changeEvent ) {
				case 'mouseover': 
					item.addEvent( 'mouseover' , function()
						{
							this.activate( item );
					  }.bind( this )
					);
					break;
				default:
					item.addEvent( 'click' , function()
						{
							item.removeClass( this.options.mouseOverClass );
							//JBV 20090625 Link-ID zur Prüfung, ob ein Link gesetzt ist
							if( $type( item ) == 'element' )
							{
      					var tempTabId = item.getProperty( 'id' );
								var tempLinkId = tempTabId.split( '-' )[0] + "-link-" + tempTabId.split( '-' )[2];
								if($(tempLinkId).innerHTML.length )
								{
									window.location.href = $(tempLinkId).innerHTML;
								}
							}
							this.activate( item );
						}.bind( this )
					);
		      item.addEvent( 'mouseover' , function()
						{
				    	if( item != this.activeTitle )
							{
		        	  item.addClass( this.options.mouseOverClass );
    			    }
			      }.bind( this )
					);
		      item.addEvent( 'mouseout' , function()
						{
			        if( item != this.activeTitle )
							{
			          item.removeClass( this.options.mouseOverClass );
      			  }
			      }.bind( this )
					);
					break;
			}
    }.bind( this ) );
    if( this.options.activateOnLoad != 'none' ){
			if( this.options.activateOnLoad == 'cookie' ){
				var tabNo = Cookie.read( this.options.cookieName.toUpperCase() );
				if( tabNo ) {
					this.activate( $( 'mootabs-title-' + tabNo ) , true );
				}
				else {
					this.activate( this.options.activateOnLoad , true );
				}
			}
      else if( this.options.activateOnLoad == 'first' ){
        this.activate( this.titles[0] , true );
      }
      else{
        this.activate( this.options.activateOnLoad , true );
      }
    }
  },
  
  activate: function( tab , skipAnim ){
    if( ! $defined( skipAnim ) ){
      skipAnim = false;
    }
    if( $type( tab ) == 'string' ){
      myTab = $$( '#' + this.elid + ' ul li' ).filter( '[title=' + tab + ']' )[0];
      tab = myTab;
    }
    if( $type( tab ) == 'element' ){
      var newTabId = tab.getProperty( 'id' );
			var newPanelId = newTabId.split( '-' )[0] + "-panel-" + newTabId.split( '-' )[2];
      this.panels.removeClass('active');
      this.activePanel = $(newPanelId);
      this.activePanel.addClass('active');
      if( this.options.changeTransition != 'none' && skipAnim == false ){
        this.activePanel.setStyle('height', 0);
        var changeEffect = new Fx.Elements(this.activePanel, {duration: this.options.duration, transition: this.options.changeTransition});
        changeEffect.start({
          '0': {
            'height': [0, this.panelHeight]
          }
        });
      }
      this.titles.removeClass('active');
      tab.addClass('active');
			if( this.options.activateOnLoad == 'cookie' ) {
				Cookie.write( this.options.cookieName.toUpperCase() , tab.getProperty( 'id' ).split( '-' )[2] , { path: this.options.cookiePath } );
			}
      this.activeTitle = tab;
      if(this.options.useAjax){
        this.getContent();
      }
    }
  },
  
  getContent: function(){
    this.activePanel.set('text', this.options.ajaxLoadingText);
    var newOptions = { url: this.options.ajaxUrl + '?tab=' + this.activeTitle.get('title'), update: this.activePanel.get('id') } ;
    this.options.ajaxOptions = $extend(this.options.ajaxOptions, newOptions);
    var req = new Request.HTML(
      this.options.ajaxOptions
    ).send();
  },
  addTab: function(title, label, content){
    var newTitle = new Element('li', {
      'title': title
    });
    newTitle.appendText(label);
    this.titles.include(newTitle);
    $$('#' + this.elid + ' ul').adopt(newTitle);
    newTitle.addEvent('click', function(){
      this.activate(newTitle);
    }.bind(this));
    newTitle.addEvent('mouseover', function() {
      if(newTitle != this.activeTitle){
        newTitle.addClass(this.options.mouseOverClass);
      }
    }.bind(this));
    newTitle.addEvent('mouseout', function() {
      if(newTitle != this.activeTitle){
        newTitle.removeClass(this.options.mouseOverClass);
      }
    }.bind(this));
    var newPanel = new Element('div', {
      'style': {'height': this.options.panelHeight},
      'id': title,
      'class': 'mootabs_panel'
    });
    if(!this.options.useAjax){
      newPanel.setHTML(content);
    }
    this.panels.include(newPanel);
    this.el.adopt(newPanel);
  },
  
  removeTab: function(title){
    if(this.activeTitle.title == title){
      this.activate(this.titles[0]);
    }
    $$('#' + this.elid + ' ul li').filter('[title='+title+']')[0].dispose();
    $$('#' + this.elid + ' .mootabs_panel').filter('[id='+title+']')[0].dispose();
  },
  
  next: function(){
    var nextTab = this.activeTitle.getNext();
    if(!nextTab){
      nextTab = this.titles[0];
    }
    this.activate(nextTab);
  },
  
  previous: function(){
    var previousTab = this.activeTitle.getPrevious();
    if(!previousTab){
      previousTab = this.titles[this.titles.length - 1];
    }
    this.activate(previousTab);
  }
});
