applications/luci-livestats/htdocs/luci-static/resources/livestats/Legend.js

   1 /*
   2     PlotKit Legend
   3     ==============
   4
   5     Handles laying out legend into a DIV element.
   6     Design taken from comments of Julien Wajsberg (http://
   7 groups.google.com/group/plotkit/browse_thread/thread/2494bd88e6e9956d)
   8     and Niel Domingo (http://nieldomingo.blogspot.com/2007/03/legend-
   9 for-plotkit-bar-charts.html).
  10
  11     Copyright
  12     ---------
  13     Copyright 2007 (c) Ashley Martens <ashleym_72^yahoo.com>
  14     For use under the BSD license. <http://www.liquidx.net/plotkit>
  15
  16 */
  17
  18 try {
  19     if (typeof(MochiKit.Base) == 'undefined'   ||
  20         typeof(MochiKit.DOM) == 'undefined'    ||
  21         typeof(MochiKit.Color) == 'undefined'  ||
  22         typeof(MochiKit.Format) == 'undefined' ||
  23         typeof(PlotKit.Layout) == 'undefined'  ||
  24         typeof(PlotKit.Base) == 'undefined')
  25     {
  26         throw "";
  27     }
  28 }
  29 catch (e) {
  30     throw "PlotKit depends on MochiKit.{Base,Color,DOM,Format}"
  31 }
  32
  33 if (typeof(PlotKit.LegendRenderer) == 'undefined') {
  34     PlotKit.LegendRenderer = {};
  35 }
  36
  37 PlotKit.LegendRenderer = function(element, layout, options) {
  38     if (arguments.length  > 0)
  39         this.__init__(element, layout, options);
  40 };
  41
  42
  43 PlotKit.LegendRenderer.NAME = "PlotKit.LegendRenderer";
  44 PlotKit.LegendRenderer.VERSION = PlotKit.VERSION;
  45
  46 PlotKit.LegendRenderer.__repr__ = function() {
  47     return "[" + this.NAME + " " + this.VERSION + "]";
  48 };
  49
  50 PlotKit.LegendRenderer.toString = function() {
  51     return this.__repr__();
  52 }
  53
  54 PlotKit.LegendRenderer.prototype.__init__ = function(element, layout,
  55 options) {
  56     var isNil = MochiKit.Base.isUndefinedOrNull;
  57     var Color = MochiKit.Color.Color;
  58
  59     this.options = {
  60         "colorScheme": PlotKit.Base.palette(PlotKit.Base.baseColors()
  61 [0]),
  62         "legendStyle": "table",
  63         "tableColumns": 1
  64     };
  65     MochiKit.Base.update(this.options, options ? options : {});
  66
  67     this.layout = layout;
  68     this.element = MochiKit.DOM.getElement(element);
  69     // --- check whether everything is ok before we return
  70
  71     if (isNil(this.element))
  72         throw "CRILegend() - passed legend is not found";
  73 };
  74
  75 PlotKit.LegendRenderer.prototype.render = function() {
  76     var colorScheme = this.options.colorScheme;
  77     var setNames = PlotKit.Base.keys(this.layout.datasets);
  78
  79         MochiKit.DOM.updateNodeAttributes(this.element,
  80         {"style":
  81       {"margin":"0"
  82       ,"padding":"0"
  83       }
  84     });
  85
  86
  87     var ul = null;
  88     if (this.options.legendStyle == "table")
  89         ul = this._renderListTable(colorScheme, setNames);
  90     else
  91         ul = this._renderList(colorScheme, setNames);
  92     MochiKit.DOM.appendChildNodes(this.element, ul);
  93
  94 };
  95
  96 PlotKit.LegendRenderer.prototype._renderList = function(colorScheme,
  97 setNames) {
  98     var ul = document.createElement("ul");
  99     ul.style.listStyle="none";
 100     ul.style.margin="0";
 101     ul.style.padding="0";
 102
 103     var colorCount = colorScheme.length;
 104     var setCount = setNames.length;
 105
 106     for (var i = 0; i < setCount; i++) {
 107         var setName = setNames[i];
 108         var color = colorScheme[i%colorCount];
 109         var le = this._renderElement(setName, color.toRGBString());
 110         ul.appendChild(le);
 111     }
 112
 113     return ul;
 114 };
 115
 116 PlotKit.LegendRenderer.prototype._renderElement = function(title,
 117 color) {
 118     var le = MochiKit.DOM.createDOM("li");
 119     le.style.listStyle="none";
 120     le.style.margin="0 0 5px 0";
 121     le.style.padding="0";
 122
 123     var box = MochiKit.DOM.createDOM("div");
 124     box.style.backgroundColor=color;
 125     box.style.width="2em";
 126     box.style.height=".9em";
 127     box.style.border="1px solid black";
 128     box.style.margin="0 5px 0 0";
 129     box.style.padding="0";
 130     box.style.float="left";
 131     box.style.cssFloat="left";
 132     box.style.clear="left";
 133     box.style.cssClear="left";
 134
 135     var span = MochiKit.DOM.createDOM("span");
 136     MochiKit.DOM.appendChildNodes(span,
 137 document.createTextNode(title));
 138
 139     MochiKit.DOM.appendChildNodes(le, box, span);
 140
 141     return le;
 142 };
 143
 144 PlotKit.LegendRenderer.prototype._renderListTable =
 145 function(colorScheme, setNames) {
 146         var tabhead = THEAD(null);
 147         var tabfoot = TFOOT(null);
 148
 149         var tabbody = partial(TBODY, null);
 150         var i = 0;
 151         var colorcount = colorScheme.length;
 152         var tabrow;
 153         var columns = this.options.tableColumns;
 154         for (var label in setNames)
 155         {
 156                 var legendcolor = colorScheme[i%colorcount];
 157                 var legendbox = DIV({'class': 'legendbox', 'className':
 158 'legendbox'});
 159                 legendbox.style.width = "10px";
 160                 legendbox.style.height = "10px";
 161                 legendbox.style.backgroundColor = legendcolor.toHexString();
 162                 legendbox.style.borderWidth = "1px";
 163                 legendbox.style.borderStyle = "solid";
 164                 legendbox.style.borderColor = "#000000";
 165                 var boxcell = TD(null, legendbox);
 166
 167                 var labelcell = TD({'class': 'legendlabel', 'className':
 168 'legendlabel'}, setNames[i]);
 169                 labelcell.style.font = 'normal 10pt arial';
 170
 171                 if (!(i % columns))
 172                 {
 173                     tabrow = partial(TR, null);
 174                 }
 175                 tabrow = partial(tabrow, boxcell, labelcell);
 176                 if (i % columns)
 177                 {
 178                     tabrow = tabrow(null);
 179                     tabbody = partial(tabbody, tabrow);
 180                 }
 181                 i++;
 182         }
 183         if ((setNames % columns))
 184         {
 185                 tabrow = tabrow(TD(null), TD(null));
 186                 tabbody = partial(tabbody, tabrow);
 187         }
 188         tabbody = tabbody(null);
 189
 190         tab = TABLE({'class': 'legendcontainer', 'className':
 191 'legendcontainer'}, tabhead, tabfoot, tabbody);
 192         tab.style.marginTop = '1em';
 193         tab.style.marginLeft = '1.5em';
 194         tab.style.marginBottom = '1em';
 195         tab.style.borderWidth = '1px';
 196         tab.style.borderStyle = 'solid';
 197         tab.style.borderColor = '#000000';
 198
 199         return tab;
 200 };
 201
 202 // Namespace Iniitialisation
 203
 204 PlotKit.Legend = {}
 205 PlotKit.Legend.LegendRenderer = PlotKit.LegendRenderer;
 206
 207
 208 PlotKit.Legend.EXPORT = [
 209     "LegendRenderer"
 210 ];
 211
 212 PlotKit.Legend.EXPORT_OK = [
 213     "LegendRenderer"
 214 ];
 215
 216 PlotKit.Legend.__new__ = function() {
 217     var m = MochiKit.Base;
 218
 219     m.nameFunctions(this);
 220
 221     this.EXPORT_TAGS = {
 222         ":common": this.EXPORT,
 223         ":all": m.concat(this.EXPORT, this.EXPORT_OK)
 224     };
 225 };
 226
 227 PlotKit.Legend.__new__();
 228 MochiKit.Base._exportSymbols(this, PlotKit.Legend);