var MediaBrowser = Behavior.create({
  initialize: function() {
    this.media_browser = this.element;
    this.content_type_buttons = this.media_browser.select(".content_types li");
    this.content_types = this.content_type_buttons.map(function(element){ return element.getAttribute("class"); });
    this.registerContentTypeButtons();
  },
  
  changeContent: function(targetContent){
    this.hideUploadPanels();
    this.media_browser.addClassName(targetContent);
  },

  hideUploadPanels: function(){
    this.content_types.each(function(className){
      this.media_browser.removeClassName(className);
    }.bind(this));
  },
    
  registerContentTypeButtons: function(){
    this.content_type_buttons.each(function(button){
      button.observeExclusively("click", this.changeContent.bind(this, button.getAttribute("class")));
    }.bind(this));
  }
});

Event.addBehavior({
  '#media_browser': MediaBrowser,
});