share/collection.js

   1 var c4 =
   2 {
   3   instances: []
   4 };
   5
   6 function graph_get_params (graph)
   7 {
   8   var graph_selector = graph.graph_selector;
   9   var inst_selector = graph.instance_selector;
  10   var selector = {};
  11
  12   if (graph_selector.host == inst_selector.host)
  13   {
  14     selector.host = graph_selector.host;
  15   }
  16   else
  17   {
  18     selector.graph_host = graph_selector.host;
  19     selector.inst_host = inst_selector.host;
  20   }
  21
  22   if (graph_selector.plugin == inst_selector.plugin)
  23   {
  24     selector.plugin = graph_selector.plugin;
  25   }
  26   else
  27   {
  28     selector.graph_plugin = graph_selector.plugin;
  29     selector.inst_plugin = inst_selector.plugin;
  30   }
  31
  32   if (graph_selector.plugin_instance == inst_selector.plugin_instance)
  33   {
  34     selector.plugin_instance = graph_selector.plugin_instance;
  35   }
  36   else
  37   {
  38     selector.graph_plugin_instance = graph_selector.plugin_instance;
  39     selector.inst_plugin_instance = inst_selector.plugin_instance;
  40   }
  41
  42   if (graph_selector.type == inst_selector.type)
  43   {
  44     selector.type = graph_selector.type;
  45   }
  46   else
  47   {
  48     selector.graph_type = graph_selector.type;
  49     selector.inst_type = inst_selector.type;
  50   }
  51
  52   if (graph_selector.type_instance == inst_selector.type_instance)
  53   {
  54     selector.type_instance = graph_selector.type_instance;
  55   }
  56   else
  57   {
  58     selector.graph_type_instance = graph_selector.type_instance;
  59     selector.inst_type_instance = inst_selector.type_instance;
  60   }
  61
  62   return (selector);
  63 } /* graph_get_params */
  64
  65 function ident_clone (ident)
  66 {
  67   var ret = {};
  68
  69   ret.host = ident.host;
  70   ret.plugin = ident.plugin;
  71   ret.plugin_instance = ident.plugin_instance;
  72   ret.type = ident.type;
  73   ret.type_instance = ident.type_instance;
  74
  75   return (ret);
  76 } /* ident_clone */
  77
  78 function json_graph_get_def (graph)
  79 {
  80   if (!graph.def)
  81   {
  82     var params = ident_clone (graph.graph_selector);
  83     params.action = "graph_def_json";
  84
  85     $.ajax({
  86       url: "collection.fcgi",
  87       async: false,
  88       dataType: 'json',
  89       data: params,
  90       success: function (data)
  91       {
  92         if (!data)
  93           return;
  94
  95         graph.def = data;
  96       }});
  97   }
  98
  99   if (graph.def)
 100     return (graph.def);
 101   return;
 102 } /* json_graph_get_def */
 103
 104 function json_graph_update (index)
 105 {
 106   var graph;
 107   var def;
 108   var params;
 109
 110   graph = c4.instances[index];
 111   if (!graph)
 112     return;
 113
 114   def = json_graph_get_def (graph);
 115   if (!def)
 116     return;
 117
 118   if (!graph.raphael)
 119   {
 120     graph.raphael = Raphael ("c4-graph" + index);
 121   }
 122
 123   params = graph_get_params (graph);
 124   params.action = "graph_data_json";
 125   params.begin = graph.begin;
 126   params.end = graph.end;
 127
 128   $.getJSON ("collection.fcgi", params,
 129       function (data)
 130       {
 131         var x_data = [];
 132         var y_data = [];
 133         var i;
 134
 135         if (!data)
 136           return;
 137
 138         for (i = 0; i < data.length; i++)
 139         {
 140           var ds = data[i];
 141
 142           var j;
 143           var x = [];
 144           var y = [];
 145
 146           for (j = 0; j < ds.data.length; j++)
 147           {
 148             var dp = ds.data[j];
 149             var t = dp[0];
 150             var v = dp[1];
 151
 152             if (v == null)
 153               continue;
 154
 155             x.push (t);
 156             y.push (v);
 157           }
 158
 159           x_data.push (x);
 160           y_data.push (y);
 161         }
 162
 163         graph.raphael.clear ();
 164         if (def.title)
 165           graph.raphael.g.text (250, 15, def.title);
 166         if (def.vertical_label)
 167           graph.raphael.g.text (5, 100, def.vertical_label).rotate (270);
 168         graph.raphael.g.linechart(50, 25, 500, 150, x_data, y_data, {axis: "0 0 1 1"});
 169       }); /* getJSON */
 170 } /* json_graph_update */
 171
 172 function format_instance(inst)
 173 {
 174   return ("<li class=\"instance\"><a href=\"" + location.pathname
 175       + "?action=show_instance;" + inst.params + "\">" + inst.description
 176       + "</a></li>");
 177 }
 178
 179 function format_instance_list(instances)
 180 {
 181   var ret = "<ul class=\"instance_list\">";
 182   var i;
 183
 184   if (instances.length == 0)
 185     return ("");
 186
 187   for (i = 0; i < instances.length; i++)
 188     ret += format_instance (instances[i]);
 189
 190   ret += "</ul>";
 191
 192   return (ret);
 193 }
 194
 195 function format_graph(graph)
 196 {
 197   return ("<li class=\"graph\">" + graph.title + format_instance_list (graph.instances) + "</li>");
 198 }
 199
 200 function update_search_suggestions ()
 201 {
 202   var term = $("#search-input").val ();
 203   if (term.length < 2)
 204   {
 205     $("#search-suggest").hide ();
 206     return (true);
 207   }
 208
 209   $("#search-suggest").show ();
 210   $.getJSON ("collection.fcgi",
 211     { "action": "search_json", "q": term},
 212     function(data)
 213     {
 214       var i;
 215       $("#search-suggest").html ("");
 216       for (i = 0; i < data.length; i++)
 217       {
 218         var graph = data[i];
 219         $("#search-suggest").append (format_graph (graph));
 220       }
 221     }
 222   );
 223 } /* update_search_suggestions */
 224
 225 function zoom_redraw (jq_obj) /* {{{ */
 226 {
 227   var url = jq_obj.data ("base_url");
 228
 229   if ((jq_obj == null) || (url == null))
 230     return (false);
 231
 232   if (jq_obj.data ('begin') != null)
 233     url += ";begin=" + jq_obj.data ('begin');
 234   if (jq_obj.data ('end') != null)
 235     url += ";end=" + jq_obj.data ('end');
 236
 237   jq_obj.attr ("src", url);
 238   return (true);
 239 } /* }}} function zoom_redraw */
 240
 241 function zoom_reset (graph_id, diff) /* {{{ */
 242 {
 243   var jq_obj;
 244   var end;
 245   var begin;
 246
 247   jq_obj = $("#" + graph_id);
 248   if (jq_obj == null)
 249     return (false);
 250
 251   end = new Number ((new Date ()).getTime () / 1000);
 252   begin = new Number (end - diff);
 253
 254   jq_obj.data ('begin', begin.toFixed (0));
 255   jq_obj.data ('end', end.toFixed (0));
 256
 257   return (zoom_redraw (jq_obj));
 258 } /* }}} function zoom_reset */
 259
 260 function zoom_hour (graph_id) /* {{{ */
 261 {
 262   zoom_reset (graph_id, 3600);
 263 } /* }}} function zoom_hour */
 264
 265 function zoom_day (graph_id) /* {{{ */
 266 {
 267   zoom_reset (graph_id, 86400);
 268 } /* }}} function zoom_day */
 269
 270 function zoom_week (graph_id) /* {{{ */
 271 {
 272   zoom_reset (graph_id, 7 * 86400);
 273 } /* }}} function zoom_week */
 274
 275 function zoom_month (graph_id) /* {{{ */
 276 {
 277   zoom_reset (graph_id, 31 * 86400);
 278 } /* }}} function zoom_month */
 279
 280 function zoom_year (graph_id) /* {{{ */
 281 {
 282   zoom_reset (graph_id, 366 * 86400);
 283 } /* }}} function zoom_year */
 284
 285 function zoom_relative (graph_id, factor_begin, factor_end) /* {{{ */
 286 {
 287   var jq_obj;
 288   var end;
 289   var begin;
 290   var diff;
 291
 292   jq_obj = $("#" + graph_id);
 293   if (jq_obj == null)
 294     return (false);
 295
 296   begin = jq_obj.data ('begin');
 297   end = jq_obj.data ('end');
 298   if ((begin == null) || (end == null))
 299     return (zoom_day (graph_id));
 300
 301   begin = new Number (begin);
 302   end = new Number (end);
 303
 304   diff = end - begin;
 305   if ((diff <= 300) && (factor_begin > 0.0) && (factor_end < 0.0))
 306     return (true);
 307
 308   jq_obj.data ('begin', begin + (diff * factor_begin));
 309   jq_obj.data ('end', end + (diff * factor_end));
 310
 311   return (zoom_redraw (jq_obj));
 312 } /* }}} function zoom_relative */
 313
 314 function zoom_reference (graph_id) /* {{{ */
 315 {
 316   var jq_obj;
 317   var end;
 318   var begin;
 319
 320   jq_obj = $("#" + graph_id);
 321   if (jq_obj == null)
 322     return (false);
 323
 324   begin = jq_obj.data ('begin');
 325   end = jq_obj.data ('end');
 326   if ((begin == null) || (end == null))
 327     return (false);
 328
 329   $(".graph-img img").each (function ()
 330   {
 331     $(this).data ('begin', begin);
 332     $(this).data ('end', end);
 333     zoom_redraw ($(this));
 334   });
 335 } /* }}} function zoom_reference */
 336
 337 function zoom_earlier (graph_id) /* {{{ */
 338 {
 339   return (zoom_relative (graph_id, -0.2, -0.2));
 340 } /* }}} function zoom_earlier */
 341
 342 function zoom_later (graph_id) /* {{{ */
 343 {
 344   return (zoom_relative (graph_id, +0.2, +0.2));
 345 } /* }}} function zoom_later */
 346
 347 function zoom_in (graph_id) /* {{{ */
 348 {
 349   return (zoom_relative (graph_id, +0.2, -0.2));
 350 } /* }}} function zoom_earlier */
 351
 352 function zoom_out (graph_id) /* {{{ */
 353 {
 354   return (zoom_relative (graph_id, (-1.0 / 3.0), (1.0 / 3.0)));
 355 } /* }}} function zoom_earlier */
 356
 357 $(document).ready(function() {
 358     /* $("#layout-middle-right").html ("<ul id=\"search-suggest\" class=\"graph_list\"></ul>"); */
 359     $("#search-form").append ("<ul id=\"search-suggest\" class=\"graph_list\"></ul>");
 360     $("#search-suggest").hide ();
 361
 362     $("#search-input").blur (function()
 363     {
 364       window.setTimeout (function ()
 365       {
 366         $("#search-suggest").hide ();
 367       }, 500);
 368     });
 369
 370     $("#search-input").focus (function()
 371     {
 372       var term = $("#search-input").val ();
 373       if (term.length < 2)
 374       {
 375         $("#search-suggest").hide ();
 376       }
 377       else
 378       {
 379         $("#search-suggest").show ();
 380       }
 381     });
 382
 383     $("#search-input").keyup (function()
 384     {
 385       update_search_suggestions ();
 386     });
 387
 388     var graph_count = 0;
 389     $(".graph-img").each (function (index, elem)
 390     {
 391       var id = "graph" + graph_count;
 392       graph_count++;
 393
 394       $(this).find ("img").each (function (img_index, img_elem)
 395       {
 396         var base_url;
 397
 398         $(this).attr ("id", id);
 399
 400         base_url = $(this).attr ("src").replace (/;(begin|end)=[^;]*/g, '');
 401         $(this).data ("base_url", base_url);
 402       });
 403
 404       $(this).append ("<div class=\"graph-buttons presets\">"
 405         + "<div class=\"graph-button\" onClick=\"zoom_hour  ('"+id+"');\">H</div>"
 406         + "<div class=\"graph-button\" onClick=\"zoom_day   ('"+id+"');\">D</div>"
 407         + "<div class=\"graph-button\" onClick=\"zoom_week  ('"+id+"');\">W</div>"
 408         + "<div class=\"graph-button\" onClick=\"zoom_month ('"+id+"');\">M</div>"
 409         + "<div class=\"graph-button\" onClick=\"zoom_year  ('"+id+"');\">Y</div>"
 410         + "<div class=\"graph-button\" onClick=\"zoom_reference ('"+id+"');\">!</div>"
 411         + "</div>"
 412         + "<div class=\"graph-buttons navigation\">"
 413         + "<div class=\"graph-button\" onClick=\"zoom_earlier ('"+id+"');\">←</div>"
 414         + "<div class=\"graph-button\" onClick=\"zoom_out     ('"+id+"');\">−</div>"
 415         + "<div class=\"graph-button\" onClick=\"zoom_in      ('"+id+"');\">+</div>"
 416         + "<div class=\"graph-button\" onClick=\"zoom_later   ('"+id+"');\">→</div>"
 417         + "</div>"
 418         );
 419     });
 420
 421     var i;
 422     for (i = 0; i < c4.instances.length; i++)
 423     {
 424       json_graph_update (i);
 425     }
 426 });
 427
 428 /* vim: set sw=2 sts=2 et fdm=marker : */