/*
 +-------------------------------------------------------------------+
 |                   H T M L - G R A P H S   (v1.3)                  |
 |                                                                   |
 | Copyright Gerd Tentler               info@gerd-tentler.de         |
 | Created: Dec. 17, 2002               Last modified: Dec. 18, 2003 |
 +-------------------------------------------------------------------+
 | This program may be used and hosted free of charge by anyone for  |
 | personal purpose as long as this copyright notice remains intact. |
 |                                                                   |
 | Obtain permission before selling the code for this program or     |
 | hosting this software on a commercial website or redistributing   |
 | this software over the Internet or in any other medium. In all    |
 | cases copyright must remain intact.                               |
 +-------------------------------------------------------------------+
*/
//======================================================================================================
// Parameters:
//
// - graph type ("hBar", "vBar", "pBar")
// - values (string with comma-separated values or array)
// - labels (string with comma-separated values or array)
// - bar color (string with comma-separated values or array)
// - hBar/vBar: label color, bar background color; pBar: background color (string)
// - show values (1 = yes, 0 = no)
// - hBar/vBar: legend items (string with comma-separated values or array)
// - number of graphs
//
// Returns HTML code
//======================================================================================================

function bar_graph(type, values, labels, bColor, lColor, showVal, legend, graphcnt, scale) {
  showVal = parseInt(showVal);
  var colors = new Array('#0000FF', '#FF0000', '#00E000', '#A0A0FF', '#FFA0A0', '#00A000');
  var colors = new Array('#9900FF', '#990066', '#00CC99', '#A0A0FF', '#FFA0A0', '#00A000');
  var images = new Array('images/glow.jpg', 'images/planet.jpg', 'images/stars.jpg', 'images/ripple.jpg');
  var d = (typeof(values) == 'string') ? values.split(',') : values;
  if(labels) var r = (typeof(labels) == 'string') ? labels.split(',') : labels;
  else var r = new Array();
  var label = graph = '';
  var percent = 0;
  if(bColor) var drf = (typeof(bColor) == 'string') ? bColor.split(',') : bColor;
  else var drf = new Array();
  var drw, val = new Array();
  var bc = new Array();
  var lc = lColor ? lColor.split(',') : new Array();
  if(lc[0]) lc[0] = lc[0].replace(/\s+/, '');
  else lc[0] = '#C0E0FF';
  if(lc[1]) lc[1] = lc[1].replace(/\s+/, '');

  if(legend && type != 'pbar') graph += '<table border=0 cellspacing=0 cellpadding=0><tr valign=top><td>';

  if(graphcnt > 1) {
    var divide = Math.ceil(d.length / graphcnt);
    graph += '<table border=0 cellspacing=0 cellpadding=6><tr valign=top><td>';
  }
  else var divide = 0;

  var sum = max = ccnt = lcnt = chart = 0;
  val[chart] = new Array();

  for(var i = 0; i < d.length; i++) {
    if(divide && i && !(i % divide)) {
      lcnt = 0;
      chart++;
      val[chart] = new Array();
    }
    if(typeof(d[i]) == 'string') drw = d[i].split(';');
    else {
      drw = new Array();
      drw[0] = d[i];
    }
    val[chart][lcnt] = new Array();
    for(var j = 0; j < drw.length; j++) {
      val[chart][lcnt][j] = parseFloat(drw[j]);
      sum += val[chart][lcnt][j];
      if(val[chart][lcnt][j] > max) max = val[chart][lcnt][j];
      if(!bc[j]) {
        if(ccnt >= colors.length) ccnt = 0;
        bc[j] = (!drf[j] || drf[j].length < 3) ? images[ccnt++] : drf[j];
      }
    }
    lcnt++;
  }
    if (scale) max = scale
//    graph += max + '<br>';
//  graph += sum + '<br>';
//  graph += max + '<br>';
  var mDiv = sum ? Math.round(max) : 0;
//  graph += mDiv + '<br>';
  var mul = mDiv ? 600 / mDiv : 1;
//  graph += mul + '<br>';
  type = type.toLowerCase();
  

  for(chart = lcnt = 0; chart < val.length; chart++) {
    graph += '<table border=0 cellspacing=1 cellpadding=0>';
    if(type == 'hbar') {
      for(i = 0; i < val[chart].length; i++, lcnt++) {
        label = (lcnt < r.length) ? r[lcnt] : lcnt+1;
        graph += '<tr><td style="font-weight:bold; font-family: arial;" rowspan=' + val[chart][i].length + ' bgcolor=' + lc[0] + ' align=center><small><small>' + label + '</small></small></td>';

        for(j = 0; j < val[chart][i].length; j++) {
          percent = sum ? Math.round(val[chart][i][j]) : 0;
          if(j) graph += '<tr>';
//          if(showVal) graph += '<td bgcolor=' + lc[0] + ' align=right>' + val[chart][i][j] + '</td>';
if(showVal) graph += '<td style="font-weight:bold; font-family: arial;" bgcolor=' + lc[0] + ' align=right><small><small>' + val[chart][i][j] + '</small></small></td>';

          graph += '<td' + (lc[1] ? ' bgcolor=' + lc[1] : '') + '>';
          graph += '<table border=0 cellspacing=0 cellpadding=0><tr>';

          if(percent) {
//            graph += '<td bgcolor=' + bc[j] + ' width=' + Math.round(percent * mul) + '>&nbsp;</td>';
graph += '<td> <img src="' +bc[j] + '" align=center width="' + Math.round(percent * mul) + '" height="16">&nbsp;</td>';
//graph += '<td <img src="glow.jpg" alt="" style="width: ' + Math.round(percent * mul) + '%;">&nbsp;</td>';
          }
          graph += '<td width=' + Math.round((mDiv - percent) * mul + 20) + '>';
          graph += '</tr></table></td>';
          graph += '</tr>';
        }
      }
    }
    else if(type == 'vbar') {
      graph += '<tr align=center valign=bottom> ';
      for(i = 0; i < val[chart].length; i++) {

        for(j = 0; j < val[chart][i].length; j++) {
          percent = sum ? Math.round(val[chart][i][j] * 100 / sum) : 0;
          graph += '<td><table border=0 cellspacing=0 cellpadding=0 width=20 align=center>';
          graph += '<tr align=center valign=bottom>';
          graph += '<td' + (lc[1] ? ' bgcolor=' + lc[1] : '') + ' height=' + Math.round((mDiv - percent) * mul + 15) + '>';
          if(percent) {
            graph += '</tr><tr align=center valign=bottom>';
            graph += '<td bgcolor=' + bc[j] + ' height=' + Math.round(percent * mul) + '>';
            graph += (document.layers ? '&nbsp;' : '') + '</td>';
          }
          graph += '</tr></table></td>';
        }
      }
      if(showVal) {
        graph += '</tr><tr align=center>';
        for(i = 0; i < val[chart].length; i++) {
          for(j = 0; j < val[chart][i].length; j++) {
            graph += '<td bgcolor=' + lc[0] + '>' + val[chart][i][j] + '</td>';
          }
        }
      }
      graph += '</tr><tr align=center>';
      for(i = 0; i < val[chart].length; i++, lcnt++) {
        label = (lcnt < r.length) ? r[lcnt] : lcnt+1;
        graph += '<td colspan=' + val[chart][i].length + ' bgcolor=' + lc[0] + '>' + label + '</td>';
      }
      graph += '</tr>';
    }
    else if(type == 'pbar') {
      for(i = 0; i < val[chart].length; i++, lcnt++) {
        label = (lcnt < r.length) ? r[lcnt] : '';
        graph += '<tr><td align=right>' + label + '</td>';

        sum = val[chart][i][1];
        percent = sum ? Math.round(val[chart][i][0] * 100 / sum) : 0;
        if(showVal) graph += '<td bgcolor=' + lc[0] + ' align=right>' + val[chart][i][0] + ' / ' + sum + '</td>';

        graph += '<td width=200 bgcolor=' + lc[0] + '>';
        graph += '<table border=0 cellspacing=0 cellpadding=0><tr>';

        if(percent) {
          bColor = drf[i] ? drf[i] : colors[0];
          graph += '<td bgcolor=' + bColor + ' width=' + Math.round(percent * 2) + '>&nbsp;</td>';
        }
        graph += '</tr></table></td>';
        graph += '</tr>';
      }
    }
    graph += '</table>';

    if(chart < graphcnt - 1 && val[chart+1].length) {
      graph += '</td>';
      if(type == 'vbar') graph += '</tr><tr valign=top>';
      graph += '<td>';
    }
  }

  if(graphcnt > 1) graph += '</td></tr></table>';

  if(legend && type != 'pbar') {
    graph += '</td><td width=10>&nbsp;</td><td>';
    graph += '<table border=0 cellspacing=0 cellpadding=1><tr><td bgcolor=#808080>';
    graph += '<table border=0 cellspacing=0 cellpadding=0><tr><td bgcolor=#F0F0F0>';
    graph += '<table border=0 cellspacing=4 cellpadding=0>';
    var l = (typeof(legend) == 'string') ? legend.split(',') : legend;
    for(i = 0; i < bc.length; i++) {
      graph += '<tr>';
//      graph += '<td bgcolor=' + bc[i] + ' nowrap>&nbsp;&nbsp;&nbsp;</td>';
graph += '<td> <img src="' + bc[i] + '" align=center width="14" height="16" nowrap>&nbsp;&nbsp;&nbsp;</td>';
      graph += '<td style="font-weight:bold; font-family: arial;" nowrap><small><small>' + (l[i] ? l[i] : '') + '</small></small></td>';
      graph += '</tr>';
    }
    graph += '</table></td></tr></table></td></tr></table>';
    graph += '</td></tr></table>';
  }
  if(document.layers) graph += '<span>';

  return graph;
}