/**
 * Original version by Andrew Tetlaw, available at
 * http://tetlaw.id.au/view/blog/fabtabulous-simple-tabs-using-prototype/
 *
 * @author Andrew Tetlaw
 * @author icoloma 
 */
loom.ui.Tabs = Class.create({

  initialize : function(element, options) {
    this.options = Object.extend({
      selectedClass: 'selected', // css class name to apply to the selected li item
      removeUnathorizedTabs: true, // remove ajax tabs if the user does not have enough permissions to invoke them
      ajaxOptions: {} // options to be passed to the Ajax request for asynchronous tabs, if any
    }, options || {});
    this.container = $(element);
    this.options.removeUnathorizedTabs && this.container.select('a.unauthorized').each(function(e) { e.up('li').remove(); }); 
    this.links = this.container.select('a');
    this.selectTab(this.getInitialTab());
    this.container.observe('click', this.onClick.bind(this));
  },

  /**
   * Invoked when a tab gets clicked
   * @param link the link that has been selected by the user
   */
  selectTab: function(link) {
    this.show(link);
    this.links.without(link).each(this.hide.bind(this));
  },
   
  onClick: function(e) {
    var a = e.findElement('a');
    if (a && this.links.indexOf(a) != -1) {
      e.stop();
      this.selectTab(a);
    }
  },  
  
  hide : function(a) {
    var tab = this.getTabForLink(a.href);
    if (tab.visible) { 
	    this.container.fire('tabs:deactivate', { tab: tab.id });
      tab.hide();
      a.up('li').removeClassName(this.options.selectedClass);
    }
  },
  
  show : function(a) {
    var href = a.getAttribute('href');
    var tab = this.getTabForLink(href);
    if (!href.startsWith('#') && tab.innerHTML.blank()) {
    	// retrieve ajax tab contents. If the response include a tag with 
    	// the same tab id, use that; else, update the tab with the entire response contents 
    	tab.addClassName('updating');
    	new Ajax.Request(href.gsub(/#.*/, ''), // remove the hash before requesting
    		Object.extend({
    			method: 'get', // tabs by default are idempotent
	    		onSuccess: function(transport) { 
	    			tab.removeClassName('updating'); 
	    			tab.update('');
	    			var div = transport.responseText.toDOM();
	    			tab.innerHTML = (div.down('#' + tab.id) || div).innerHTML;
				    this.container.fire('tabs:load', { tab: tab });
	    		}.bind(this)
	    	}, this.options.ajaxOptions)
    	);
    }
    a.up('li').addClassName(this.options.selectedClass);
    tab.show();
    this.container.fire('tabs:activate', { tab: tab.id });
  },
  
  /**
   * Return the tab corresponding to a link, null if there is no hash in the link
   */
  getTabForLink: function(href) {
	var hash = href.match(/#(\w.+)/);
	return hash && $(hash[1]);
  },

  
  getInitialTab : function() {
    var tab = this.getTabForLink(document.location.href);
    var result = tab && this.links.find(function(e) { 
	      return this.getTabForLink(e.href) == tab; 
	    }.bind(this));
    return result || this.links.first();
  },
  
  observe: function(event, listener) {
  	this.container.observe(event, listener);
  }
  
});