//-------------------------------------------------------------------
// Define WxGui.Input module
//-------------------------------------------------------------------

if (typeof(JSAN) != 'undefined') {
  JSAN.use('MochiKit.Base');
  JSAN.use('MochiKit.DateTime');
  JSAN.use('MochiKit.Format');
  JSAN.use('MochiKit.DOM');
  JSAN.use('MochiKit.Signal');
  JSAN.use('WxUtils.Util');
}

if (typeof(WxGui) == 'undefined') {
  WxGui = {};
} 
WxGui.Input = {};
WxGui.Input.NAME = 'WxGui.Input';
WxGui.Input.VERSION = '1.0';
WxGui.Input.EXPORT = [
  'Base',
  'String',
  'Email',
  'Integer',
  'DateInput',
  'File',
  'Image',
  'Password',
  'CheckBox',
  'RadioGroup',
  'Text',
  'HTMLText',
  'Select'
  ];

WxGui.Input.__repr__ = function () {
    return "[" + this.NAME + " " + this.VERSION + "]";
};
WxGui.Input.toString = function () {
    return this.__repr__();
};

//-------------------------------------------------------------------
// WxGui.Input.Base (basic inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Base = function() {
  this.version = '0.1';
  this.wform = null; 
  this.leaveField = null;  
  this.afterFieldValidated = null; 
  this.errorMessage = '';
  MochiKit.Base.bindMethods(this);
};

WxGui.Input.Base.prototype = {
  "setOptions": function(options) {
    update(
      this.options = {
        tab:        null,
        label:      'basefield',
        editable:   1,
        visible:    1,
        required:   0,
        size:       '30',
        showlabel: 1,
        maxlength:  0,
        defaultval: 'basefield',
        assistant:  'Assistant content'
      }, options || {});
  },
  "init": function(id, frm, options, wform) {
    this.wform = wform;
    this.id = id;
    this.element = (frm===null) ? null : MochiKit.DOM.getElement(frm);
    this.assistant = null;
    this.input = [];
    this.setOptions(options || {});
    this.render();
    this.addLabelEvents();
    this.value = null; 
    this.renderedField = null; 
  },
  "render": function() {
    this.generateInput();
    this.addInputEvents();
    this.setDefault();
    if (this.options.editable) {
      if (this.options.values) {
        for (i = 0;i < this.options.values.length;i++) {
          this.input[i].setAttribute('tabindex', '1');
        }
      } else {
        this.input[0].setAttribute('tabindex', '1');
      }
    } else {
      if (this.options.values) {
        for (i = 0;i < this.options.values.length;i++) {
          this.input[i].setAttribute('tabindex', '-1');
          this.input[i].setAttribute('disabled', 'true');
        }
      } else {            
        for (i = 0; i < this.input.length; i++) {
          this.input[i].setAttribute('tabindex', '-1');
          this.input[i].setAttribute('disabled', 'true');
        }
      }
    }            
    if (this.wform.use_assistant) {
      if (this.renderAssistant()) {
        row.appendChild(this.assistant);      
        // Say it again so IE grasps it.
        this.assistant.style.display = 'none';
      }
    }
      
   // the actual composition
   if (this.element) {
      this.addToForm(row);
    }
    this.renderedField  = row;
    return;
  },
  "addToForm": function(row) {
    this.element.appendChild(row);
  },
  "setDefault": function() {              
    if (this.options.defaultval) {
      this.setValue(this.options.defaultval);
    } else{
      this.setValue('');
    }
  },
  "setFocus": function() {
    this.input[0].focus();
    this.input[0].select();
  },
  "generateInput": function() {
    this.input[0] = MochiKit.DOM.INPUT(
      {'type':'text',
       'id':this.id,
       'name':this.id+':string',
       'size':this.options.size});
    this.label =  MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id}, this.options.label);
    row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
              MochiKit.DOM.DIV({'class':this.options.required ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
              this.options.showlabel ? this.label: null,
              this.input[0]);
    if (this.options.maxlength > 0) {
      this.input[0].setAttribute('maxlength', this. options.maxlength);
    }
    if (!this.options.visible) {
      row.style.display = 'none';
    }
  },
  "renderAssistant": function() {               
    if (this.options.assistant) {
      ast_text = MochiKit.DOM.DIV({'class':'topassistant'},null);
      ast_text.innerHTML = this.options.assistant;
      this.assistant = MochiKit.DOM.DIV({'class':'assistant',
                            'id':'ast_'+this.id,
                            'style':'display:none'},
                            ast_text,
                            MochiKit.DOM.DIV({'class':'bottomassistant'}));
      return this.assistant;
    } else {
      this.assistant = null;
      return this.assistant;
    }
  },
  setAssistantText: function(newtext) { 
    ast_text = MochiKit.DOM.DIV({'class':'topassistant'},null);
    ast_text.innerHTML = newtext; 
    this.assistant = MochiKit.DOM.DIV({'class':'assistant',
                          'id':'ast_'+this.id,
                          'style':'display:none'},
                          ast_text,
                          MochiKit.DOM.DIV({'class':'bottomassistant'}));
    swapDOM($('ast_'+this.id), this.assistant);    
  },
  "showAssistant": function() {
    if (this.assistant) {
      this.assistant.style.display='block';
      if (document.all) {
        this.assistant.style.top = this.input[0].parentNode.offsetTop - (this.assistant.offsetHeight - 9)  + 'px';
      } else {
        this.assistant.style.top = this.input[0].parentNode.offsetTop - this.assistant.offsetHeight  + 'px';
      }
      astid = 'ast_'+this.id;  
    }
  },
  "hideAssistant": function() {
    if (this.assistant) {
      this.assistant.style.display='none';
    }
  },
  "setValue": function(val) {
    this.input[0].value = val;
    this.syncValue();
  },
  "syncValue": function() {
    this.value = this.input[0].value;
  },       
  "formatValue": function() {
//    if (this.options.format) {
//        ;
//    }
  },
  "labelClicked": function(evt) {
//    evt = (evt) ? evt : ((event) ? event : null);
//    target = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
    target = evt.target();
    theid = target.id.slice(6);
    
    MochiKit.DOM.getElement(theid).focus();
    MochiKit.DOM.getElement(theid).select();
  },
  "setLabel": function(val) {
   this.options.label = val;
   lbl = MochiKit.DOM.getElement('label_'+this.id);
   lbl.removeChild(lbl.firstChild);
   lbl.appendChild(document.createTextNode(val));
  },
  "toggleEditable": function() {
    if (this.options.required && MochiKit.Format.strip(this.input[0].value)===''){
     return;
    }
    if (this.options.editable) {
      this.setNotEditable();
    } else {
      this.setEditable();
    }
  },
  setEditable: function() {
    this.options.editable = true;
    for (x = 0; x < this.input.length; x++) {
      this.input[x].removeAttribute('disabled');
      this.input[x].setAttribute('tabindex', '1');
    }    
  },
  setNotEditable: function() {
    this.options.editable = false;     
    for (x = 0; x < this.input.length; x++) {
      this.input[x].setAttribute('disabled', true);
      this.input[x].removeAttribute('tabindex');
    }    
  },
  "toggleRequired": function(val) {
    if (!this.options.editable) { return; }

    if (this.options.required) {
      this.setNotRequired();
    } else {
      this.setRequired();
    }
  },              
  setRequired: function(val) {
    this.options.required = true;
    MochiKit.DOM.getElement('reqrd_'+this.id).className='required';    
  },
  setNotRequired: function(val) {
    this.options.required = false;
    MochiKit.DOM.getElement('reqrd_'+this.id).className='notrequired';
  },
  "toggleVisibility": function () {     
    if (this.options.visible) {
      this.setInvisible();    
    } else {
      this.setVisible();
    }
  },                                  
  setVisible: function () {     
    this.options.visible = true;
    $('fld_'+this.id).style.display = 'block';      
  },
  setInvisible: function () {     
    this.options.visible = false;
    $('fld_'+this.id).style.display = 'none';      
  },  
  addInputEvents: function() {
    MochiKit.Signal.connect(this.input[0], 'onfocus',this.onInputFocus);
    MochiKit.Signal.connect(this.input[0], 'onblur', this.onInputBlur);
  },
  "addLabelEvents": function()
  {
    MochiKit.Signal.connect(this.label, 'onclick' ,this.labelClicked);
    this.label.style.cursor = document.all ? 'hand' : 'pointer';
  },
  "onInputFocus": function(evt) {
    evt.target().className='selected';
    try {
      if (this.wform.use_assistant) { this.showAssistant(); }     
    } catch(e) {}
  },
  "onInputBlur": function(evt) {
    target = evt.target();
    evt.returnValue = false;
    try {
      this.formatValue();
      this.syncValue();
      if (this.wform.use_assistant) {this.hideAssistant();}
      evt.returnValue = this.checkValue(); 
    } catch(e) {alert(e);}                
    
    // Make userchecks possible
    if (this.leaveField !== null) {
      evt.returnValue = this.leaveField();
    }
    
    // Reflect the result in the userinterface
    if (evt.returnValue) {
      evt.target().className='';
      if (this.afterFieldValidated !== null) {
        this.afterFieldValidated();
      }
    } else {
      target.className='notvalid';
    }
    return evt.returnValue;
  },
  "checkValue": function() {
    if (this.value === null) {
      this.value = '';
    }
    if (this.options.required && MochiKit.Format.strip(this.value) === '') {
      this.setErrorMessage(this.options.label+': Dit is een verplicht veld.');
      return false;
    }
    return true;
  },
  setErrorMessage: function(txt) {
    this.errorMessage = txt;
  }
};

//-------------------------------------------------------------------
// WxGui.Input.String (String inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.String = function() {
  this.version = '0.1';
  MochiKit.Base.bindMethods(this);
  
};

WxGui.Input.String.prototype = update (new WxGui.Input.Base(), {
  "test":function() {
    /* Aanroep parent class
    ParentClass.prototype.init.call(this, arg1, arg2);

    or (to call with the same arguments):
    ParentClass.prototype.init.apply(this, arguments);
    */
  },
  "init": function(id,frm,options,wform) {
    WxGui.Input.Base.prototype.init.call(this, id,frm,options,wform);
//    this.inspector = new WxGui.Input.String.Inspector();    
//    this.inspector.init(this)
//    alert(this.inspector);
  }  
});  

//-------------------------------------------------------------------
// WxGui.Input.Email (Email inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Email = function() {
  this.version = '0.1';
  MochiKit.Base.bindMethods(this);
};

WxGui.Input.Email.prototype = update (new WxGui.Input.String(), {
  /* Overrule and add methods */
  checkValue: function() {
    if (this.value === null) {
      this.value = '';
    }
    if (this.options.required && MochiKit.Format.strip(this.value) === '') {
      // Field is required and empty
      this.setErrorMessage(this.options.label+': Dit is een verplicht veld.');
      return false;
    }                     
    this.input[0].value = MochiKit.Format.strip(this.input[0].value);     
    this.syncValue();    
    var filter  = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if (filter.test(this.value)) {
      return true;
    } else {
      return false;
    }
  },                               
  formatValue: function() {          
    // force to lowercase
    this.input[0].value =  this.input[0].value.toLowerCase();
  }
});

//-------------------------------------------------------------------
// WxGui.Input.Integer (Integer inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Integer = function() {
  this.version = '0.1'; 
  MochiKit.Base.bindMethods(this);
};
/* Take all behaviors from Base */
WxGui.Input.Integer.prototype = update (new WxGui.Input.String(), {
  /* Overrule methods */
  "checkValue": function() {
    if (this.value === null) {
      this.value = '0';
    }
    if (this.options.required && MochiKit.Format.strip(this.input[0].value) === '') {
      this.input[0].select();
      this.setErrorMessage(this.options.label+' invoer is verplicht');
      return false;
    }
    if (WxUtils.Util.isInteger(this.value)) {
      return true;
    } else {
      this.setErrorMessage(this.options.label+': Alleen gehele getallen toegestaan');
      return false;
    }
    return true;
  },                             
  "formatValue": function() {
     if (this.options.format) {  
       this.input[0].value = numberFormatter(this.options.format)(this.input[0].value === "" ? 0 :this.input[0].value);
     }
  }
});
//-------------------------------------------------------------------
// WxGui.Input.Date (Date inputfield widget)
//-------------------------------------------------------------------

WxGui.Input.Date = function() {
  this.version = '0.1';
  MochiKit.Base.bindMethods(this);
};
WxGui.Input.Date.prototype = update(new WxGui.Input.Base(),{
/* Overrule and add methods */
                  
  "init": function(id,frm,options,wform) {
    WxGui.Input.Base.prototype.init.call(this, id,frm,options,wform);
    if (!this.options.format) {
      this.options.format=('Y,M,D');
    }
    if (!this.options.dateseparator) {
      this.options.dateseparator = '-';
    }
    if (!this.options.timeseparator) {
      this.options.timeseparator = ':';
    }
  },
  "generateInput": function() {            
    // find out the format
    this.dateorder = this.options.format.split(',');
    for (a=0;a<this.dateorder.length;a++) {
      switch(this.dateorder[a]) {
        case 'Y':
          this.dateorder[a] = 0;
          break;
        case 'M':
          this.dateorder[a] = 1;
          break;
        case 'D':
        this.dateorder[a] = 2;
          break;
      }
    }
    this.checkOn = this.dateorder[2];
    this.input[0] = MochiKit.DOM.INPUT(
      {'type':'text',
       'style':'margin-right:3px',
       'id':this.id,
       'name':this.id+'_year',
       'tabindex':1,
       'maxlength':'4',
       'size':'4'});
     this.input[1] = MochiKit.DOM.INPUT(
       {'type':'text',
        'style':'margin-right:3px',
        'id':this.id,
        'name':this.id+'_month',
        'tabindex':1,
        'maxlength':'2',
        'size':'2'});
      this.input[2] = MochiKit.DOM.INPUT(
        {'type':'text',
         'style':'margin-right:3px',
         'id':this.id,
         'name':this.id+'_day',
         'tabindex':1, 
         'maxlength':'2',
         'size':'2'});
      this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
      row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
                MochiKit.DOM.DIV({'class':this.options.required ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
                  this.options.showlabel ? this.label: null,
                  this.input[this.dateorder[0]],
                  this.input[this.dateorder[1]],
                  this.input[this.dateorder[2]]);
      if (!this.options.visible) {
        row.style.display = 'none';
      }
  },

  "checkValue": function() {
      return true;
  },
  "setDefault": function() {
    if (!this.options.defaultval) {
      this.options.defaultval = 'today';
    }
    if (this.options.defaultval === 'today') {
      this.setValue(toISOTimestamp(new Date()));
    }                             
  },
  "setValue": function(val) {
      if (WxUtils.Util.isNull(val)) {
        this.value = new Date();
      } else {
        this.value = isoTimestamp(val);
      }                               
      this.input[0].value = numberFormatter("0000")(this.value.getFullYear());
      this.input[1].value = numberFormatter("00")(this.value.getMonth()+1);
      this.input[2].value = numberFormatter("00")(this.value.getDate());
  },
  "syncValue": function() {
    this.value = new Date(parseInt(this.input[0].value,10),parseInt(this.input[1].value,10)-1,parseInt(this.input[2].value,10));
  },
  "addInputEvents": function() {
      MochiKit.Signal.connect(this.input[0], 'onfocus', this.onInputFocus);
      MochiKit.Signal.connect(this.input[1], 'onfocus', this.onInputFocus);
      MochiKit.Signal.connect(this.input[2], 'onfocus', this.onInputFocus);

      MochiKit.Signal.connect(this.input[0], 'onblur', this.onInputBlur);
      MochiKit.Signal.connect(this.input[1], 'onblur', this.onInputBlur);
      MochiKit.Signal.connect(this.input[2], 'onblur', this.onInputBlur);
  },
  "onInputBlur": function(evt) {
    target = evt.target();
    target.className='';
    try {
      this.formatValue();
      this.syncValue();
      if (this.wform.use_assistant) {this.hideAssistant();}
      if (target.name == this.input[2].name) { // Day          
        if (WxUtils.Util.isBlank(MochiKit.Format.strip(target.value))) {
          target.value = new Date().getDate();
        }
        if (parseInt(target.value,10) > 31) {
          target.value = 31;
        }
        if (parseInt(target.value,10) < 1) {
          target.value = 1;
        }
      }  
      if (target.name == this.input[1].name) { // Month
        if (parseInt(target.value,10) > 12) {
          target.value = 12;
        } else if (parseInt(target.value,10) < 1) {
          target.value = 1;
        } else if (WxUtils.Util.isBlank(MochiKit.Format.strip(target.value))) {
          target.value = new Date().getMonth();
        }
      }  
      if (target.name == this.input[0].name) { // Year      
        if (parseInt(target.value,10)<50) {
          target.value = parseInt(target.value,10)+2000;
        } else if (parseInt(target.value,10)>=50 && parseInt(target.value,10)<100) {
          target.value = parseInt(target.value,10)+1900;        
        } else if (WxUtils.Util.isBlank(MochiKit.Format.strip(target.value,10))) {
          target.value = new Date().getFullYear();
        }
        target.value = numberFormatter("0000")(target.value);
      }  
      if (target.name == this.input[this.checkOn].name) {
        return this.checkValue();
      }    
      return true;
    } catch(e) {alert(e);}
  }  
});                           
//-------------------------------------------------------------------
// WxGui.Input.File (File uploadfield widget)
//-------------------------------------------------------------------

WxGui.Input.File = function() {
  this.version = '0.1';            
  MochiKit.Base.bindMethods(this);  
};
WxGui.Input.File.prototype = update (new WxGui.Input.Base(), {
    "generateInput": function() {
       this.input[0] = MochiKit.DOM.INPUT(
         {'type':'file',
          'id':this.id,
          'name':this.id+':string',
          'size':this.options.size});
       this.input[0].setAttribute('name',this.id+':file');
       this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
       row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
                 MochiKit.DOM.DIV({'class':this.options.required ? 'required' : 'notrequired','id':'reqrd_'+this.id}), 
                 this.options.showlabel ? this.label: null,
                 this.input[0]);
       if (this.options.maxlength > 0) {
         this.input[0].setAttribute('maxlength', this. options.maxlength);
       }
       if (!this.options.visible) {
         row.style.display = 'none';
       }    
     }  
});
//-------------------------------------------------------------------
// WxGui.Input.Image (Image uploadfield widget)
//-------------------------------------------------------------------

WxGui.Input.Image = function() {
  this.version = '0.1';            
  MochiKit.Base.bindMethods(this);  
};
WxGui.Input.Image.prototype = update (new WxGui.Input.Base(), {
    "generateInput": function() {
       this.input[0] = MochiKit.DOM.INPUT(
         {'type':'file',
          'id':this.id,
          'name':this.id+':string',
          'size':this.options.size});
       this.input[0].setAttribute('name',this.id+':file');
       this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
       row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
                 MochiKit.DOM.DIV({'class':this.options.required ? 'required' : 'notrequired','id':'reqrd_'+this.id}), 
                 this.options.showlabel ? this.label: null,
                 this.input[0]);
       if (this.options.maxlength > 0) {
         this.input[0].setAttribute('maxlength', this. options.maxlength);
       }
       if (!this.options.visible) {
         row.style.display = 'none';
       }    
     }  
});

//-------------------------------------------------------------------
// WxGui.Input.Password (Password inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Password = function() {
  this.version = '0.1';            
  MochiKit.Base.bindMethods(this);
};                          
WxGui.Input.Password.prototype = update (new WxGui.Input.String(), {
  /* Overrule methods */
  "generateInput": function() {
     this.input[0] = MochiKit.DOM.INPUT(
       {'type':'password',
        'id':this.id,
        'name':this.id+':string',
        'size':this.options.size});
     this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
     row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
               MochiKit.DOM.DIV({'class':(this.options.required) ? 'required' : 'notrequired','id':'reqrd_'+this.id}), 
               (this.options.showlabel) ? this.label: null,
               this.input[0]);
     if (this.options.maxlength > 0)
       this.input[0].setAttribute('maxlength', this. options.maxlength);
     if (!this.options.visible) {
       row.style.display = 'none';
     }    
   },
  "checkValue": function() {
    if (this.value === null) {
      this.value = '';
    }
    if (this.options.required && MochiKit.Format.strip(this.value) === '') {
      this.setErrorMessage(this.options.label+': Invoer is verplicht');
      return false;
    }
    if (this.options.minlength > this.value.length ) {
      this.setErrorMessage(this.options.label+': Dit veld moet minimaal '+this.options.minlength+' karakters bevatten');      
      return false;
    }
    return true;
  }
});

//-------------------------------------------------------------------
// WxGui.Input.Checkbox (Checkbox inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Checkbox = function() {
  this.version = '0.1'; 
  MochiKit.Base.bindMethods();
};
/* Take all behaviors from Base */
WxGui.Input.Checkbox.prototype = update (new WxGui.Input.Base(), {
  generateInput: function() {
     this.input[0] = MochiKit.DOM.INPUT(
       {'type':'checkbox',
        'class':'wcheckbox',
        'id':this.id,
        'name':this.id+':checkbox',
        'style':'width:14px;height:14px'}
        );
     this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
     row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
               MochiKit.DOM.DIV({'class':(this.options.required) ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
               (this.options.showlabel) ? this.label: null,
               this.input[0]);
     if (this.options.maxlength > 0)
       this.input[0].setAttribute('maxlength', this. options.maxlength);
     if (!this.options.visible) {
       row.style.display = 'none';
     }    
   },
  "setDefault": function() {
    if (!this.options.defaultval) {
      this.options.defaultval = false;
    }
    switch (this.options.defaultval) {
    case true:
      this.input[0].checked = true;
      this.input[0].defaultChecked = true;
      break;
    case false:
      this.input[0].checked = false;
      this.input[0].defaultChecked = false;
      break;
    }                             
  },
  "setValue":function(val) {
    this.input[0].checked = val;
    this.syncValue();
  },
  "syncValue":function() {
    this.value = this.input[0].checked;
  }                                                     
});

//-------------------------------------------------------------------
// WxGui.Input.RadioGroup (RadioGroup inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.RadioGroup = function() {
  this.version = '0.1';
  MochiKit.Base.bindMethods(this);
};

/* Take all behaviors from Checkbox */
WxGui.Input.RadioGroup.prototype = merge (new WxGui.Input.Checkbox(), {
  "setDefault": function() {
    if (this.options.defaultval) {
      for (rb = 0;rb < this.options.values.length;rb++) {
        if (this.options.values[rb].code == this.options.defaultval) {
          this.input[rb].checked = true;
          this.input[rb].defaultChecked = true;
        } else {
          this.input[rb].checked = false;          
        }
      }
    }
  },
  "setValue": function(val) {
    this.input[0].checked = val;
    this.syncValue();
  },
  "syncValue": function() { 
    for (i=0;i < this.input.length;i++) {
      if (this.input[i].checked) {
        this.value = this.options.values[i].code;
      }
    }
  },           
  "checkValue": function() {
    return true;
  },
  "generateInput": function() {
    this.label =  MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for': 'fld_'+this.id});
    this.label.innerHTML = this.options.label;
    row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
              MochiKit.DOM.DIV({'class':(this.options.required) ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
              (this.options.showlabel) ? this.label: null);
    rg = MochiKit.DOM.DIV({'class':'radiogroup'});

    for (rb = 0;rb < this.options.values.length;rb++) {
      this.input[rb] = MochiKit.DOM.INPUT(
        {'type':'radio',
         'style':'margin-right:3px',
         'id':this.id+this.options.values[rb].code,
         'name':this.id+':radio',                                
         'value': this.options.values[rb].code,
         'checked':false,
         'tabindex':1
        });                  
      connect(this.input[rb],'onclick', this,
        function(e) {
          e.target().checked = true;
          e.target().defaultChecked = true;
          this.value = e.target().value;
        }
      );
      st = {'style':'float:none;zoom:1;display:block;','class':'radiolabel'};
      if (this.options.format) {
        switch (this.options.format) {
          case 'inrow':
            txt = SPAN({'style':'display:block'});
            txt.innerHTML = this.options.values[rb].descr;
            lbl = MochiKit.DOM.DIV(st, this.input[rb],txt);
            rg.appendChild(lbl);
            break;
          case 'inline':
          default:
            st = {'style':'float:left;width:auto','class':'radiolabel'};
            txt = SPAN({'style':'display:block'});
            lbl = MochiKit.DOM.DIV(st, this.input[rb],this.options.values[rb].descr);
            rg.appendChild(lbl);
            break;
        }
      }
    }
    row.appendChild(rg);
    if (!this.options.visible) {
      row.style.display = 'none';
    }
  },
  "addLabelEvents": function()  {
    return;
  },
  showAssistant: function() {
    return
  }
  
});

//-------------------------------------------------------------------
// WxGui.Input.Text (Text inputfield widget)
//-------------------------------------------------------------------
WxGui.Input.Text = function() {
  this.version = '0.1';
  MochiKit.Base.bindMethods(this);
};

WxGui.Input.Text.prototype = update(new WxGui.Input.Base(), {
  /* Overrule methods */
 "generateInput": function() {                           
    this.input[0] = TEXTAREA({'id':this.id,'name':this.id+':lines','tabindex':1},this.options.defaultval);
    this.input[0].style.height = this.options.size[0]+'px';
    this.input[0].style.width = this.options.size[1]+'px';
    this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
    row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
              MochiKit.DOM.DIV({'class':(this.options.required) ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
              (this.options.showlabel) ? this.label: null,
//              MochiKit.DOM.DIV({'class':'label','id':'label_'+this.id},this.options.label),
              this.input[0]); 
    if (!this.options.visible) {
      row.style.display = 'none';
    }
  }
});                     

//-------------------------------------------------------------------
// WxGui.Input.HtmlText (HtmlText inputfield widget)
//-------------------------------------------------------------------

/* -------------------- HtmlText field -------------------- */
WxGui.Input.HtmlText = function() {
  this.version = '0.2';
  MochiKit.Base.bindMethods(this);
};

WxGui.Input.HtmlText.prototype = update(new WxGui.Input.Base(), {
  /* Overrule methods */
 "generateInput": function() {                           
    this.input[0] = TEXTAREA({'id':this.id,'name':this.id+':lines','tabindex':1},this.options.defaultval);
    this.input[0].style.height = this.options.size[0]+'px';
    this.input[0].style.width = this.options.size[1]+'px';
    row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'}, this.input[0]); 
    if (!this.options.visible) {
      row.style.display = 'none';
    }


  },
  "addToForm": function(row) {
    this.element.appendChild(row);
    this.initEditor();
  },
  "addLabelEvents": function()
  {
    return;
  },   
  "initEditor": function() {    
    this.wysiwyg = new Wysiwyg();
    this.wysiwyg.init(this.id, this.element);
    connect(this.options.tab, 'onsheetselect', this,
      function(e) {
        this.wysiwyg.doc.body.contentEditable = true;
        callLater(1.0, this.activateEditor);
      }
    );
    //generate_wysiwyg(this.id);     
    //doc  = $('wysiwyg'+this.id).contentWindow.document;
    //doc.body.contentEditable = true;    
    //doc.designMode = "on";
  },
  activateEditor: function() {
    this.wysiwyg.doc.designMode = 'on';
  }
});                     

//-------------------------------------------------------------------
// WxGui.Input.Select (Select widget)
//-------------------------------------------------------------------
WxGui.Input.Select = function() {
  this.version = '0.2';
  MochiKit.Base.bindMethods(this);
};

/* Take all behaviors from Checkbox */
WxGui.Input.Select.prototype = update (new WxGui.Input.Checkbox(), {  
  generateInput: function() { 
    this.label = MochiKit.DOM.createDOM('label',{'class':'label','id':'label_'+this.id,'for':'fld_'+this.id},this.options.label);
    this.input[0] = MochiKit.DOM.SELECT({'id':'select_'+this.id, 'name':this.id+':select','style':'width:'+this.options.size+'px'}, 
                      map(this.addOption, this.options.values));
    row = MochiKit.DOM.DIV({'id': 'fld_'+this.id,'class':'inputrow'},
              MochiKit.DOM.DIV({'class':(this.options.required) ? 'required' : 'notrequired','id':'reqrd_'+this.id}),
              this.label, this.input[0]);
    if (!this.options.visible) {
      row.style.display = 'none';
    }
    connect(this.input[0],'onchange', this,
      function(e) {
        this.syncValue();
      }
    );
  },
  addOption: function(ob) {
    return OPTION({'id':this.id+ob.code, 'value': ob.code}, ob.descr);
  },
  setDefault: function() {              
    if (this.options.defaultval)
      this.setValue(this.options.defaultval);   
    else
      this.setValue('');   
  },
  addLabelEvents: function() {
  },
  setValue: function(val) {
    this.input[0].value = val;
    this.syncValue();
  },
  syncValue: function() {
    this.value = this.input[0].value;
  },  
  setTabIndex: function() {
    if (this.options.editable) {
      this.input[0].setAttribute('tabindex', '1');
    } else {
      this.input[0].setAttribute('tabindex', '-1');
      this.input[0].setAttribute('disabled', 'true');
    }                
  },
  render: function() {
    this.generateInput();
    this.addInputEvents();
    this.setDefault();
    if (this.options.editable) {
    } else {
    }            
    if (this.wform.use_assistant) {
      if (this.renderAssistant()) {
        row.appendChild(this.assistant);      
        // Say it again so IE grasps it.
        this.assistant.style.display = 'none';
      }
    }
      
   // the actual composition
   if (this.element)
      this.addToForm(row);
    this.renderedField  = row;
    return;
  },
  checkValue: function() {
    if (this.value === null) {
      this.value = '';
    }
    if (this.options.required && MochiKit.Format.strip(this.value) === '') {
      this.setErrorMessage(this.options.label+': Dit is een verplicht veld.');
      return false;
    }
    return true;
  }
});

WxGui.Input.__new__ = function () {
    MochiKit.Base.nameFunctions(this);
    this.EXPORT_TAGS = {
      ":common": this.EXPORT,
      ":all": this.EXPORT
    };
};

//WxGui.Input.__new__();
//MochiKit.Base._exportSymbols(this, WxGui.Input);