/**
 * Método construtor do HTMLChart. Responsável por criar o componente Gráfico.
 * @param sys - Indica o código do sistema.
 * @param formID - Indica o código do formulário.
 * @param posX - Posição do componente na tela em relação ao eixo X.
 * @param posY - Posição do componente na tela em relação ao eixo Y.
 * @param width - Largura do componente.
 * @param heigth - ALtura do componente. 
 * @param alt - hint/title da imagem do grafico.
 * @param value 
 **/
function HTMLChart(sys, formID, code, posX, posY, width, height, alt, value) {
	this.create(sys, formID, code, posX, posY, width, height, '', value);
	this.report = false;
	this.alt = alt;
	this.viewMode = "Estender";
	this.url="";
	this.hasImage = true;
}

/**
 * Propriedades do Gráfico.
 **/
HTMLChart.inherits(HTMLElementBase);
HTMLChart.prototype.name = 'HTMLChart';
HTMLChart.prototype.tabable = false;
HTMLChart.prototype.zindex = 2;

/**
 * Seta a Url da imagem gerada pra o Gráfico.
 * @param url - endereço da imagem gerada. 
 **/
HTMLChart.prototype.setUrl = function(url){
	this.url = url;
	this.context.innerHTML = "";
	this.img = new ImageObject().getImage(this.url, this.alt, null, this.height, this.width);
	this.context.appendChild(this.img);
}


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

/**
 * Resposável por criar o HTMLTable onde a imagem gerada pelo grafico será adicionada.
 * @param doc - documento onde a HTMLTable será inserida.
 **/
HTMLChart.prototype.designComponent = function(doc) {		
	// Desenhar Tabela 
  this.table = document.createElement("table");
  this.table.setAttribute('border', 0);
  this.table.setAttribute('cellSpacing', 1);
  this.table.setAttribute('cellPadding', 0);
  this.table.setAttribute('width', '100%');
  this.table.setAttribute('height', '100%');

  this.table.style.backgroundColor = "#CCCCCC";
  var tbody = document.createElement("tbody");
  this.table.appendChild(tbody);

  var tr = document.createElement("tr");
  tbody.appendChild(tr);

  var td = document.createElement("td");
  td.style.backgroundColor = "#FFFFFF";
  td.style.color = "#000000";
  var descTable;

  descTable = getLabel("(Gráfico)");
  
  td.appendChild(descTable);
  td.style.textAlign = 'center';
  td.style.verticalAlign = 'middle';
  td.style.cursor = 'pointer';
  
  tr.appendChild(td);

  this.divTable = this.getDiv('NOIMAGE', 0, 0, this.width, this.height, 5, true);
  
  this.divTable.appendChild(this.table);

  this.context.appendChild(this.divTable);
  visibleDiv(this.divTable, !this.hasImage);
  
  // Imagem a ser mostrada na tela
  this.img = new ImageObject().getImage(this.url, this.alt, this.getAction('doOnClick'), this.height, this.width);
  
  this.context.appendChild(this.img); 
}

HTMLChart.prototype.doOnClick = function() {
  if (this.onclick) {
    this.onclick.call(this); 
  }
}

HTMLChart.prototype.getPermissionDescription = function() {
  if (!isNullable(this.permissionDescription)) {
    return this.permissionDescription;
  }
  return this.callMethod(HTMLElementBase, "getPermissionDescription");
}