var msCultureSwitchButton = Class.create(msButton, {
  xtype: 'culture-switch-button',
   
  //a reference to the custom content will be drawn
  viewer: false,

  // redefine the constructor
  initialize: function ($super,config) {
    $super(config);
    
    if(!this.viewer) {
      Object.extend(this, { viewer: eval(this.config.viewer) });
    }   
  },
  
  clickListner: function(event, ci) {    
    var data = $A(arguments).shift();    
    this.viewer.getEl(ci.container_name, ci.select_name);
  },
  
  // redefine the build method
  build: function ($super) {      
    
    this.el = new Element('div', {'class': 'msr-button-2 msr-' + this.xtype });
    
    var inner = new Element('div', { });
    
    if (
        this.config.verify_localized &&
        (window[this.config.verify_localized] == undefined || window[this.config.verify_localized].length == 0)
      ) 
    { 
      return;
    }      
            
    var id = this.config.name.replace(/\x20/g,'');
    var select_name = id + '_select';
    var container_name = id + 'container';    

    p = new Element('p', {'class': 'msr-button-label', 'style' : "display:block;float:left;width:80px" });
    p.innerHTML = this.config.name;
    inner.appendChild(p);     
    
    Obj = this;
     
    listfiltercultures.each(function(s) {
      
      icon = '/shared/img/famfamflags/' + s.substr(3,2).toLowerCase() + '.gif';

      var culture_switch = new Element ('img', { 'id': id + '_flag', 'style': 'padding:1px;', 'src' : icon});

      Event.observe(culture_switch, 'click', Obj.clickListner.bindAsEventListener(
        Obj,
        { 'container_name': container_name, 'select_name': select_name }
      ));
      
      inner.appendChild(culture_switch);   
    });
    
    this.el.appendChild(inner);   
  },
  
  clickListner: function(e, container, element) {  
    console.log(e);
  }
});