share/collection.js

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