
$.fn.tabs = function(options){
  var opts = $.extend($.fn.tabs.defaults, options);

  $(this).bind('refresh', function(e) {
    $(this).each(function(){
      var tabwrapper = $(this),
        data = tabwrapper.data('bx-tabs'),
        url = $.bbq.getState( tabwrapper.attr('id') ) || '';

      if (data.url == url) { return; }
      data.url = url;

      var panels = tabwrapper.find('> div');
      var tabs = tabwrapper.find('> ul a');

      tabs.parent().removeClass('selected');
      panels.hide();
      
      url = (url == '') ? tabs.filter(':first').attr('href').replace(/^#/,'') : url;
//      tabs.filter('[href=#' + url + ']').addClass('selected');
      tabs.filter('[href=#' + url + ']').parent().addClass('selected');
      panels.filter('#' + url)[opts.transition]();
    });
  });


  $('a.' + opts.external_tab).click(function(){
    var state = {},
      urlarr = $(this).attr('href').replace(/^#/, '').split('='),
      id = urlarr[0],
      url = urlarr[1];
      
    state[id] = url;  
    $.bbq.pushState(state);
      
    return false;
  });

  return this.each(function(){
    var $tabwrapper = $(this);
    
    $tabwrapper.data( 'bx-tabs', {} );

    var $tabs = $tabwrapper.find('> ul a');

    $tabs.click(function(){
      var state = {},
        id = $tabwrapper.attr('id'),
        url = $(this).attr('href').replace(/^#/, '');
        
      state[id] = url;  
      $.bbq.pushState(state);
      
      return false;
    });

    $tabs.each(function(){
      $('a[name=' + $(this).attr('href').replace(/^#/,'') + ']').remove();
    });

  });
};

$.fn.tabs.defaults = {
  transition: "fadeIn",
  external_tab: "extab"
};