/**
 * MindCMS 3
 *
 * @class   msButton
 * @extends msContainer
 *
 * @package CMS3
 * @author Gabriel PREDA <gabriel.preda@mindbench.nl>
 * @author Francisc Ungureanu <francisc.ungureanu@mindbench.nl> 
 * @copyright Mindbench Active Media B.V.
 * @version $Id: msButton.js 8408 2009-02-27 08:53:54Z rma $
 *
 * Details:
 * This will hold specific buttons implementations
 * 
 * buttonDetails
 * {
 *  - name
 *  - icons (only-one || [small, big])
 *  - accesskey
 *  - action: href || callback
 * }
 * 
 * 
 *   
 */
var msButton = Class.create(msContainer, {
  xtype: 'button',
  state: 0,
  
  initialize: function ($super, config)
  {  
    $super(config);
    
    this.config = 
    {
      name: 'Unnamed Button', // src to icon
      icon: 'UndefinedIcon.gif',
      accesskey: '', // one character used as shortcut
      action: '#',
      icon_size: 'small',
      disabled: false,
      text_position: 'vertical',
      button_state: [ 'name', 'icon' ]
    };
    Object.extend(this.config, config || {});

    this.build();
  },
   
  build: function() {
    var layout = this.config.text_position == 'vertical' ? '2' : '1';
    this.el = new Element('div');
    this.el.title = this.config.name;
   
    var action = this.config.action;
    
    if (this.config.key != undefined) {
      var id = this.config.key.replace(/\x20/g,'');
    }
    else {
      var id = this.config.name.replace(/\x20/g,'');	
    }
    
    
    this.el.id = 'btn-' + id;
    
    if (action.callback) {
      this.el.onclick = function(event) {
        
    	if (!this.parentNode.hasClassName('msr-button-disabled')) {
    	    
          if(action.params) {
            eval(action.callback+'(event, ' + Object.toJSON(action.params) + ')');
          }
          else {
            eval(action.callback+'(event)');
          }
    	}
      };
    }
    else if (action.url) {
      
      this.el.onclick = function(event) {
        window.location.href = action.url;
      };      
    }

    
    icon = '';
    if (this.config.icon != 'UndefinedIcon.gif') {      
      for (i = 0; i < this.config.icon.length; i++) {

        var img = new Image()
        img.src = this.config.icon[i];
        img.alt = this.config.name;
        img.className = 'msr-button-icon';
        
        var display = (
          this.config.button_state.join(':').match(/name/)!=null && i == (this.config.icon_size == 'small' ? 0 : 1)
            ? true : false
        );

        if(!display) $(img).hide();
        
        this.el.insert(img);
      }
      
      //adds an extra space
      this.el.innerHTML = this.el.innerHTML +' ';
    }

    displayText = ( this.config.button_state[0] == 'name' || this.config.button_state[1] == 'name' ) ? 'inline' : 'none';
   
    var paragraph = new Element('P', {'class': 'msr-button-label' });
    paragraph.innerHTML = this.config.name;
    this.el.insert(paragraph);
    
    var wrapper = new Element('div', { 'class': 'msr-button-' + layout+(this.xtype == 'button' ? '' : ' msr-'+this.xtype) });

    this.el = Element.wrap(this.el,wrapper);
    
    if (this.config.disabled) {
      this.disable();
    }
    
    if(this.config.active) {
      this.activate();
    }
    
  },

  getLayout: function() {
    return this.config.text_position;
  },
  
  getWidth: function() {
    var titleEl = $(this.el).select('.msr-button-label')[0];
    var imageEl = $(this.el).select('.msr-button-icon')[0];
    
    if(this.config.text_position == 'horizontal') {
      return Math.max(titleEl.getWidth(), imageEl.getWidth());
    }
    else {
      return this.el.getWidth();
    }
  },
  
  getWidthForState: function(state) {
    var titleEl = $(this.el).select('.msr-button-label')[0];
    if(!titleEl) return this.el.getWidth();
    
    var titleW = titleEl.getWidth();
    var imageEl = $(this.el).select('.msr-button-icon');
    
    var result;
    var hidden = titleEl.getStyle('display') == 'none';
    
    if(hidden){ 
      titleEl.show();
      titleW = titleEl.getWidth();
      titleEl.hide();
    }
    
    if(this.config.text_position == 'horizontal') {
      switch(true) {
        //BIG IMAGE + TEXT
        case state == 1: 
        result = Math.max(titleW, imageEl[0].getWidth());break;
        //JUST BIG IMAGE
        case state == 2: result = imageEl[0].getWidth();break;
        //SMALL IMAGE + TEXT          
        case imageEl.length > 1 && state == 3: result = Math.max(titleW, imageEl[1].getWidth());break;
        //JUST SMALL IMAGE
        case imageEl.length > 1 && state == 4: result = imageEl[1].getWidth();break;
        default:
          result = 1000;
      }
    }
    else if (this.config.text_position == 'vertical') {
     
      switch(true) {
        //SMALL IMAGE + TEXT
        case state == 1: result = titleW + ( imageEl.length > 0 ? imageEl[0].getWidth() : 0);break;
        //JUST TEXT
        case state == 2: result = titleW;break;
        //JUST IMAGE
        case state == 3: result = imageEl[0].getWidth();break;
        default:
          result = 1000;
      }
    }
    else {
      result = 1000;
    }
    
    return result;
  },
  
  getState: function () {
    return this.state;
  },
  
  setState: function (state) {
    var titleEl = $(this.el).select('.msr-button-label')[0];
    
    if(!titleEl) {
      return;
    }
    
    //console.log(state);
    var imageEl = $(this.el).select('.msr-button-icon');
    
    if(this.config.text_position == 'horizontal') {
      switch(true) {
        //BIG IMAGE + TEXT
        case state == 1:
          titleEl.show();
          imageEl[0].show();
          if(imageEl.length>1) imageEl[1].hide();
          break;
        //JUST BIG IMAGE
        case state == 2:
          titleEl.hide();
          imageEl[0].show();
          if(imageEl.length>1) imageEl[1].hide();
          break;
        //SMALL IMAGE + TEXT
        case imageEl.length ==2 && state == 3:
          titleEl.show();
          imageEl[0].hide();
          imageEl[1].show();
          break;
        //JUST SMALL IMAGE
        case imageEl.length ==2 && state == 4:
          titleEl.hide();
          imageEl[0].hide();
          imageEl[1].show();
          break;
      }
      
    }
    else if (this.config.text_position == 'vertical') {
      switch(state) {
        //SMALL IMAGE + TEXT
        case 1: 
          titleEl.show();
          if(imageEl.length > 0) imageEl[0].show();
          break;
        //JUST TEXT
        case 2:
          titleEl.show();
          if(imageEl.length > 0) imageEl[0].hide();
          break;
        //JUST IMAGE
        case 3:
          titleEl.hide();
          if(imageEl.length > 0) imageEl[0].show();
          break;
      }
    }
    
  },
  
  disable: function() {
  	this.el.addClassName('msr-button-disabled');
  	/*
  	icon = $(this.el).select('div .msr-button-icon')[0];
  	
  	if (!this.originalSrc) {
  	  this.originalSrc = icon.src;
  	}
  	
  	i = this.originalSrc.replace(/\//g, '__');
  	
  	var pi = window.location.href.indexOf('_dev', 0);
    var controller = pi >= 0 ? '_dev' : '';
      
  	icon.src = '/backend' + controller + '.php/images/filter/icon/' + i;
  	*/
  },
  
  enable: function() {
  	this.el.removeClassName('msr-button-disabled');
  	/*
  	icon = $(this.el).select('div .msr-button-icon')[0];
  	
  	icon.src = this.originalSrc;*/
  },
  
  activate: function() {
    this.el.addClassName('msr-active-item');
  },
  
  deactivate: function() {
    this.el.removeClassName('msr-active-item');
  
  }
});