Ext.ux.SmilesMenu = function (config) {
	Ext.ux.SmilesMenu.superclass.constructor.call(this, config);
  this.plain = true;
  var ci = new Ext.ux.SmilesItem(config);
  this.add(ci);
  
  //this.palette = ci.palette;
  this.relayEvents(ci, ["select"]);
}

Ext.extend(Ext.ux.SmilesMenu, Ext.menu.Menu, {
});





Ext.ux.SmilesItem = function(config){
    Ext.ux.SmilesItem.superclass.constructor.call(this, new Ext.SmilesPalette(config), config);
    
    this.palette = this.component;
    this.relayEvents(this.palette, ["select"]);
    if(this.selectHandler){
        this.on('select', this.selectHandler, this.scope);
    }
};
Ext.extend(Ext.ux.SmilesItem, Ext.menu.Adapter);











Ext.SmilesPalette = function(config){
    Ext.SmilesPalette.superclass.constructor.call(this, config);
    this.addEvents({
        
        select: true
    });

    if(this.handler){
        this.on("select", this.handler, this.scope, true);
    }
};
Ext.extend(Ext.SmilesPalette, Ext.Component, {
    
    itemCls : "x-smile-palette",
    
    value : null,
    clickEvent:'click',
        ctype: "Ext.SmilesPalette",

    
    allowReselect : false,

    
    colors : [
        "000000", "993300", "333300", "003300", "003366", "000080", "333399", "333333",
        "800000", "FF6600", "808000", "008000", "008080", "0000FF", "666699", "808080",
        "FF0000", "FF9900", "99CC00", "339966", "33CCCC", "3366FF", "800080", "969696",
        "FF00FF", "FFCC00", "FFFF00", "00FF00", "00FFFF", "00CCFF", "993366", "C0C0C0",
        "FF99CC", "FFCC99", "FFFF99", "CCFFCC", "CCFFFF", "99CCFF", "CC99FF", "FFFFFF"
    ],
    	
    smiles: [
    	"air_kiss", "biggrin", "bad", "blum1", "blush", "bomb", "bye2", "cool", "cray", "crazy", "dance", "diablo", "drinks", "gamer", "girl_angel", "give_heart", "give_rose", "good", "hang1", "hi", "ireful", "i_am_so_happy", "kiss", "kiss3", "lol", "mad", "man_in_love", "mocking", "music", "nea", "pardon", "rofl", "sad", "scratch_one-s_head", "shok", "shout", "smile", "sorry", "unknown", "wacko1", "dash1", "mail1", "sarcastic", "wacko2", "wacko3", "mamba", "wink", "yahoo", "yes", "girl_phone1", "girl_haha", "girl_flag_of_truce", "flag_of_truce" , "girl_in_dreams", "girl_blush", "connie_threaten", "fool" , "angel_old", "ban_old", "bigeyes_old", "censored_old", "clap_old", "doctor_old", "fight_old", "help_old", "insane_old", "ninja_old","laught_old", "love_old", "sad_old", "sleep_old", "smile2_old", "smile3_old", "smile_old", "super_old", "tease_old", "think_old", "verybigeyes_old" , "weep_old", "wink_old"
    ],

    onRender : function(container, position){
        var t = new Ext.MasterTemplate(
            '<tpl><a href="#" class="smile-{0}" hidefocus="on"><em><img src="/pages/channel/smiles/gal1/{0}.gif" unselectable="on"></em></a></tpl>'
        );
        var c = this.smiles;
        for(var i = 0, len = c.length; i < len; i++){
            t.add([c[i]]);
        }
        var el = document.createElement("div");
        el.className = this.itemCls;
        t.overwrite(el);
        container.dom.insertBefore(el, position);
        this.el = Ext.get(el);
        this.el.on(this.clickEvent, this.handleClick,  this, {delegate: "a"});
        if(this.clickEvent != 'click'){
            this.el.on('click', Ext.emptyFn,  this, {delegate: "a", preventDefault:true});
        }
    },

    afterRender : function(){
      Ext.SmilesPalette.superclass.afterRender.call(this);
      if(this.value){
          var s = this.value;
          this.value = null;
          this.select(s);
      }
    },

    handleClick : function(e, t){
      e.preventDefault();
      if(!this.disabled){
          var c = t.className.match(/(?:^|\s)smile-(.*)(?:\s|$)/)[1];
          this.select(c);
      }
    },

    
    select : function(color){
      if(color != this.value || this.allowReselect){
      	 this.fireEvent("select", this, color);
      }
    }
});