function HTMLRadioGroup(sys, formID, code, posX, posY, width, height, description, value, labels, values) {
  this.create(sys, formID, code, posX, posY, width, height, description, value);
  this.labels = labels;
  this.values = values;
  if (!this.values) this.values = this.labels;
  this.columns = 1;
  this.options = new Array();
  this.inputname = 'WFRInput'+this.code;
}

HTMLRadioGroup.inherits(HTMLElementBase);

HTMLRadioGroup.prototype.name = 'HTMLRadioGroup';
HTMLRadioGroup.prototype.tabable = true;

HTMLRadioGroup.prototype.setWidth = function(width) {
  width = parseInt(width);
  this.width = width;
  this.gb.setWidth(width);
}

HTMLRadioGroup.prototype.setHeight = function(height) {
  height = parseInt(height);
  this.height = height;
  this.gb.setHeight(height);
}

HTMLRadioGroup.prototype.setDescription = function(description) {
  this.description = description;
  this.gb.setDescription(description);
}

HTMLRadioGroup.prototype.setColor = function(color) {
  this.color= color;
  this.gb.setColor(color);
}

HTMLRadioGroup.prototype.setBGColor = function(color) {
  this.bgColor= color;
  this.gb.setBGColor(color);
}

HTMLRadioGroup.prototype.setFont = function(f) {
  this.font = f;
  this.gb.setFont(f);
}

HTMLRadioGroup.prototype.setSize = function(s) {
  this.size = s;
  this.gb.setSize(s);
}

HTMLRadioGroup.prototype.setEnabled = function(v) {
  this.enabled = v;
  for (i=0;i<this.options.length;i++)
    this.options[i].setEnabled(v);
}

HTMLRadioGroup.prototype.setReadOnly = function(v) {
  this.readonly = v;
  for (i=0;i<this.options.length;i++)
    this.options[i].setReadOnly(v);

  if (v) {
    if (!this.roDiv) {
      this.roDiv = getDiv('', 0, 0, this.width, this.height, this.zindex+1, true);
      this.context.appendChild(this.roDiv);
    }
  } else {
    if (this.roDiv)
      this.context.removeChild(this.roDiv);
    this.roDiv = null;
  }
}

HTMLRadioGroup.prototype.setColor = function(color) {
  this.color= color;
  for (i=0;i<this.options.length;i++)
    this.options[i].setColor(color);
}

HTMLRadioGroup.prototype.setVisible = function(v) {
  this.visible = v;
  visibleDiv(this.div, v);
  for (i=0;i<this.options.length;i++)
    this.options[i].setVisible(v);
}

HTMLRadioGroup.prototype.setColumns = function(c) {
  this.columns = c;
  this.reDesign();
}

HTMLRadioGroup.prototype.focus = function() { return false; }

HTMLRadioGroup.prototype.blur = function() { return false; }

HTMLRadioGroup.prototype.designOptions = function(tabControl) {
  var rows = Math.ceil(this.labels.length / this.columns);

  var topts = getTable(rows, this.columns, '100%', '100%');
  var cells = topts[CELLS];
  var idx = 0;
  for (i=0;i<this.columns;i++) {
    for (j=0;j<rows;j++) {
      if (idx < this.values.length) {
        var o = new  HTMLRadioGroupOption(this, this.sys, this.formID, this.code, this.labels[idx], this.values[idx]);
        o.index = idx;
        o.tabindex = this.tabindex;
        o.onclick = this.onclick;
        o.onchange = this.onchange;
        o.color = this.color;
        o.dependent = this.dependent;
        if (tabControl != undefined) {
          o.design(cells[j][i], this.doc, tabControl);
        } else {
          o.design(cells[j][i], this.doc, true);
        }
        this.options.push(o);
        idx++;
      }
    }
  }
  return topts[TABLE];
}

HTMLRadioGroup.prototype.getValue = function() {
  return this.hidden.value;
}

HTMLRadioGroup.prototype.getShowValue = function() {
  for (i=0;i<this.options.length;i++) {
    if (this.options[i].isChecked())
      return this.options[i].getShowValue();
  }
  return '';
}

HTMLRadioGroup.prototype.setValue = function(value) {
  value = normalizeRuleParam(value);
  var temp = this.value;
  this.hidden.setValue(value);
  
  if (this.gb) {
    this.gb.setValue(value);
  }

  this.value = value;
  for (i=0;i<this.options.length;i++) {
    if (this.options[i].value == this.value)
      this.options[i].setChecked(true);
    else
      this.options[i].setChecked(false);
  }

  if (this.value != temp) {
    this.changeAction(window.event);
  }
}

HTMLRadioGroup.prototype.designComponent = function(doc, tabControl) {

  this.hidden = new HTMLHidden(this.sys, this.formID, this.code, this.value);
  this.hidden.inputname = this.inputname;
  this.hidden.design(doc);

  this.gb = new HTMLGroupBox(this.sys, this.formID, this.code, 0, 0, this.width, this.height, this.description, '');
  this.gb.required = this.required;
  this.zIndex = 1;
  this.gb.design(this.context);
  this.gb.content.appendChild(this.designOptions(tabControl));

  for (i=0;i<this.options.length;i++) {
    if (this.options[i].value == this.value)
      this.options[i].setChecked(true);
    else
      this.options[i].setChecked(false);
  }
}

HTMLRadioGroup.prototype.reDesign = function(tabControl) {
  this.free(true);
  this.options = new Array();
  this.div.innerHTML = '';
  this.designComponent(this.doc, tabControl);
}


HTMLRadioGroup.prototype.add = function(value, label) {
  this.labels = this.labels.concat([label]);
  this.values = this.values.concat([value]);
  this.reDesign();
}

HTMLRadioGroup.prototype.removeByIndex = function(idx) {
  this.labels.splice(idx, 1);
  this.values.splice(idx, 1);
  this.reDesign();
}

HTMLRadioGroup.prototype.removeByKey = function(key) {
  var idx = arrayIndexOf(this.values, key);
  if (idx != -1) {
    this.values.splice(idx, 1);
    this.labels.splice(idx, 1);
    this.reDesign();
  } else
    interactionError(getLocaleMessage("INFO.KEY_ELEMENT_DOES_NOT_EXIST",key));
}

HTMLRadioGroup.prototype.focusNext = function(current) {
  if (current >= this.options.length-1)
    this.options[0].focus();
  else
    this.options[current+1].focus();
}

HTMLRadioGroup.prototype.focusPrevious = function(current) {
  if (current <= 0)
    this.options[this.options.length-1].focus();
  else
    this.options[current-1].focus();
}

/**********************
* OPÇÕES DO RADIOGROUP
**********************/

function HTMLRadioGroupOption(group, sys, formID, code, description, value) {
  this.create(sys, formID, code, 0, 0, 0, 0, description, value);
  this.name = 'HTMLRadioGroupOption';
  this.tabable = true;
  this.group = group;
  this.checked = false;
  
  // Relativo a font da opção
  if (group.size) {
    this.size = group.size;
  }
}

HTMLRadioGroupOption.inherits(HTMLElementBase);

HTMLRadioGroupOption.prototype.ignore = true;

HTMLRadioGroupOption.prototype.updateImage = function() {
  var activation = '';
  if (!this.enabled)
    activation = '_des';
  this.img.src = skin+((this.checked)?'radio_checked'+activation+'.gif':'radio_unchecked'+activation+'.gif');
  if (this.readonly || !this.enabled) {
    this.onkeydown = null;
    this.removeEvent(this.input, 'click');
    this.removeEvent(this.labelCell, 'click');
    this.labelCell.style.cursor = '';
  } else {
    this.attachEvent(this.input, 'click', this.click);
    this.attachEvent(this.labelCell, 'click', this.click);
    this.onkeydown = this.keyPressedAction;
    this.labelCell.style.cursor = 'pointer';
  }
  if (!this.enabled) {
    this.label.style.color = '#999999';
  } else {
    if (this.color) {
      this.label.style.color = this.color;
    } else {
      this.label.style.color = '';
    }
    if (this.size) {
      this.label.style.fontSize = this.size;
    }
  }
}

HTMLRadioGroupOption.prototype.designComponent = function(doc) {

  this.input = document.createElement("a");
  this.input.href = 'javascript:;';

  this.img = document.createElement("img");
  this.img.border = '0';

  this.input.appendChild(this.img);
  this.label = getLabel(this.description);
  this.table = getSetTable(this.input, this.label);
}

HTMLRadioGroupOption.prototype.design = function(cell, doc, tabControl, checked) {
  this.doc = doc;
  this.context = this.doc;
  this.designComponent();
  this.div = this.table;
  this.table.onmousedown = function() { return false; };
  this.table.onselectstart = function() { return false; };
  this.table.style.cursor = 'pointer';
  this.labelCell = this.table.firstChild.firstChild.childNodes[1];
  this.attachEvent(this.labelCell, 'click', this.click);

  cell.appendChild(this.table);
  this.cell = cell;
  this.init(tabControl);
  this.updateImage();
}

HTMLRadioGroupOption.prototype.keyPressedAction = function(e) {
  var key = getKey(e);
  if (key == 32)
    this.click();
  else if (key == 40)
    this.group.focusNext(this.index);
  else if (key == 38)
    this.group.focusPrevious(this.index);
}

HTMLRadioGroupOption.prototype.setReadOnly = function(v) {
  this.readonly = v;
  this.updateImage();
}

HTMLRadioGroupOption.prototype.setEnabled = function(v) {
  this.enabled = v;
  this.updateImage();
}

HTMLRadioGroupOption.prototype.setColor = function(color) {
  this.color= color;
  this.label.style.color = color;
}

HTMLRadioGroupOption.prototype.setChecked = function(checked) {
  this.checked = checked;
  this.updateImage();
}

HTMLRadioGroupOption.prototype.isChecked = function() {
  return this.checked;
}

HTMLRadioGroupOption.prototype.getValue = function() {
  return this.value;
}

HTMLRadioGroupOption.prototype.getShowValue = function() {
  return this.description;
}

HTMLRadioGroupOption.prototype.setVisible = function(v) {
  this.visible = v;
}

HTMLRadioGroupOption.prototype.click = function(e) {
  this.input.focus();
  this.group.clickAction(e);
  this.group.setValue(this.value);
}

HTMLRadioGroup.prototype.setHint = function(hint) {
	this.callMethod(HTMLElementBase, "setHint", [hint]);
	
	if (this.div) {
	  this.div.alt = hint;
	  this.div.title = hint;
	}
}

HTMLRadioGroupOption.prototype.designDragComponent = function() { /**/ }

HTMLRadioGroupOption.prototype.setDraggable = function(draggable) { }

HTMLRadioGroupOption.prototype.setResizable = function(resizable) { }

HTMLRadioGroupOption.prototype.flush = function() {
  if (this.label) {
    if (this.label.onmousedown) this.label.onmousedown = null;
    if (this.label.onselectstart) this.label.onselectstart = null;
    this.label = null;
  }
  if (this.labelCell) {
    if (this.labelCell.onmousedown) this.labelCell.onmousedown = null;
    if (this.labelCell.onselectstart) this.labelCell.onselectstart = null;
    this.labelCell = null;
  }
  if (this.table) {
    if (this.table.onmousedown) this.table.onmousedown = null;
    if (this.table.onselectstart) this.table.onselectstart = null;
    this.table = null;
  }
  this.img = null;
	this.callMethod(HTMLElementBase, "flush");
}