/*
 * flugrid for jQuery - simple fluid Grid
 *
 * Copyright (c) 2008 Joe Rivard (Red Orbit Systems LLC)
 * Dual licensed under the MIT (MIT-LICENSE.txt)
 * and GPL (GPL-LICENSE.txt) licenses.
 *
 * $Date: 2008-07-16$
 */
(function($) {
  $.simpleGraph = {
    type:{vertical: "vertical",horizontal: "horizontal",barGraph: "bar"},
    dataType:{number: "float",percent: "percent"} //integer, float, percent   
  };
  String.format = function( text ){
    if ( arguments.length <= 1 ){
        return text;
    }
    
    var tokenCount = arguments.length - 2;
    for( var token = 0; token <= tokenCount; token++ ){      
        text = text.replace( new RegExp( "\\{" + token + "\\}", "gi" ), arguments[ token + 1 ] );
    }
    return text;
  };
  $.fn.simpleGraph = function(options,callback) {
      var settings = {
          width: '100%',
          height: '100%',
          barWidth: null,
          format: "{0}",
          type: $.simpleGraph.type.horizontal,
          dataType: $.simpleGraph.dataType.number
      };
      if ( options && typeof(options) != 'string' )
        $.extend(settings, options);
      //set height/width to auto
      (settings.type == $.simpleGraph.type.horizontal) ? settings.height = 'auto' : settings.width= 'auto';
      //function to generate html for vertical style tables
      generate_vertical_table = function(bars){
        bars_row = $("<tr class='bars'></tr>");
        labels_row = $("<tr></tr>").append("<td class='seperator'></td>");
        for(index in bars){
          bar = bars[index];
          bar.percentage = settings.dataType == "percent" ? Number(bar.value) : Number((bars[index].value / high)* 100); 
          col = $("<td class='bar_container'></td>").append("<div class='bar'></div>");
          //set html and height
          barEl = col.find(".bar");
          barEl.html(String.format(settings.format, bar.value));
          barEl.css({height: Number(bar.percentage).toFixed(0) + "%"})
          if(settings.barWidth){barEl.parent().css({width: settings.barWidth});}
          //create label column
          labels_row.append("<td colspan='2' class='label'>" + bar.label + "</td>");
          //append column to row
          bars_row.append("<td class='seperator'></td>").append(col);                            
        }
        bars_row.append("<td class='seperator'></td>");
        table.append(bars_row).append(labels_row);        
      }
      //function to generate html for horizontal style tables
      generate_horizontal_table = function(bars){
        for(index in bars){
          bar = bars[index];
          bar.percentage = settings.dataType == "percent" ? Number(bar.value) : Number((bars[index].value / high)* 100);          
          //create row with label
          row = $("<tr></tr>").append("<td class='label'>" + bar.label + "</td>");
          row.append("<td><div class='bar_container'><div class='bar'></div></div></td>")
          barEl = row.find(".bar");
          barEl.css({width:Number(bar.percentage).toFixed(0) + "%"})
          if(settings.barWidth){
            center = (Number(settings.barWidth / 2) + Number(settings.barWidth*.2))
            barEl.css({height: settings.barWidth,paddingTop: center});
          }
          barEl.html(String.format(settings.format, bar.value));
          table.append(row);          
          table.append("<tr class='seperator'><td></td></tr>")
        }
      }
      //Go through each UL and generate graph
      this.each(function() {
        if($(this).attr("tagName") != "UL"){return}
        bars = new Array();
        $(this).children().each(function(){          
          bars.push({type:settings.dataType, value: $(this).attr("val"), label: $(this).html()});          
        })        
        total = 0;high = 0;
        //grab top value and total of all values
        for (index in bars){
          total += Number(bars[index].value);
          if(high < parseFloat(bars[index].value)){high = Number(bars[index].value)}
        }
        if(settings.dataType != $.simpleGraph.dataType.percent){high += high *.1;}
        //generate rows
        table = $("<table cellpadding='0' cellspacing='0'></table");
        if(settings.type == $.simpleGraph.type.horizontal){
          generate_horizontal_table(bars);
        }else{
          generate_vertical_table(bars);
        }
        table.addClass(settings.type + "-graph").css({height: settings.height, width: settings.width})
        $(document.body).append(table);
        table.insertAfter(this);
        $(this).remove();
        return table;
      });    
  }
  $.simple_graph = $.simpleGraph;
})(jQuery);