Code

2cb6f306e28c841e2e75d8bb8b1a6bb05ff69f78
[collection4.git] / share / collection.js
1 var c4 =
2 {
3   instances: []
4 };
6 function graph_get_params (graph)
7 {
8   var graph_selector = graph.graph_selector;
9   var inst_selector = graph.instance_selector;
10   var selector = {};
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   }
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   }
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   }
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   }
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   }
62   return (selector);
63 } /* graph_get_params */
65 function ident_clone (ident)
66 {
67   var ret = {};
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;
75   return (ret);
76 } /* ident_clone */
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";
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;
95         graph.def = data;
96       }});
97   }
99   if (graph.def)
100     return (graph.def);
101   return;
102 } /* json_graph_get_def */
104 function json_graph_update (index)
106   var graph;
107   var def;
108   var params;
110   graph = c4.instances[index];
111   if (!graph)
112     return;
114   def = json_graph_get_def (graph);
115   if (!def)
116     return;
118   if (!graph.raphael)
119   {
120     graph.raphael = Raphael ("c4-graph" + index);
121   }
123   params = graph_get_params (graph);
124   params.action = "graph_data_json";
125   params.begin = graph.begin;
126   params.end = graph.end;
128   $.getJSON ("collection.fcgi", params,
129       function (data)
130       {
131         var x_data = [];
132         var y_data = [];
133         var i;
135         if (!data)
136           return;
138         for (i = 0; i < data.length; i++)
139         {
140           var ds = data[i];
142           var j;
143           var x = [];
144           var y = [];
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];
152             if (v == null)
153               continue;
155             x.push (t);
156             y.push (v);
157           }
159           x_data.push (x);
160           y_data.push (y);
161         }
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 */
172 function format_instance(inst)
174   return ("<li class=\"instance\"><a href=\"" + location.pathname
175       + "?action=show_instance;" + inst.params + "\">" + inst.description
176       + "</a></li>");
179 function format_instance_list(instances)
181   var ret = "<ul class=\"instance_list\">";
182   var i;
184   if (instances.length == 0)
185     return ("");
187   for (i = 0; i < instances.length; i++)
188     ret += format_instance (instances[i]);
189   
190   ret += "</ul>";
192   return (ret);
195 function format_graph(graph)
197   return ("<li class=\"graph\">" + graph.title + format_instance_list (graph.instances) + "</li>");
200 function update_search_suggestions ()
202   var term = $("#search-input").val ();
203   if (term.length < 2)
204   {
205     $("#search-suggest").hide ();
206     return (true);
207   }
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 */
225 function zoom_redraw (jq_obj) /* {{{ */
227   var url = jq_obj.data ("base_url");
229   if ((jq_obj == null) || (url == null))
230     return (false);
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');
237   jq_obj.attr ("src", url);
238   return (true);
239 } /* }}} function zoom_redraw */
241 function zoom_reset (graph_id, diff) /* {{{ */
243   var jq_obj;
244   var end;
245   var begin;
247   jq_obj = $("#" + graph_id);
248   if (jq_obj == null)
249     return (false);
251   end = new Number ((new Date ()).getTime () / 1000);
252   begin = new Number (end - diff);
254   jq_obj.data ('begin', begin.toFixed (0));
255   jq_obj.data ('end', end.toFixed (0));
257   return (zoom_redraw (jq_obj));
258 } /* }}} function zoom_reset */
260 function zoom_hour (graph_id) /* {{{ */
262   zoom_reset (graph_id, 3600);
263 } /* }}} function zoom_hour */
265 function zoom_day (graph_id) /* {{{ */
267   zoom_reset (graph_id, 86400);
268 } /* }}} function zoom_day */
270 function zoom_week (graph_id) /* {{{ */
272   zoom_reset (graph_id, 7 * 86400);
273 } /* }}} function zoom_week */
275 function zoom_month (graph_id) /* {{{ */
277   zoom_reset (graph_id, 31 * 86400);
278 } /* }}} function zoom_month */
280 function zoom_year (graph_id) /* {{{ */
282   zoom_reset (graph_id, 366 * 86400);
283 } /* }}} function zoom_year */
285 function zoom_relative (graph_id, factor_begin, factor_end) /* {{{ */
287   var jq_obj;
288   var end;
289   var begin;
290   var diff;
292   jq_obj = $("#" + graph_id);
293   if (jq_obj == null)
294     return (false);
296   begin = jq_obj.data ('begin');
297   end = jq_obj.data ('end');
298   if ((begin == null) || (end == null))
299     return (zoom_day (graph_id));
301   begin = new Number (begin);
302   end = new Number (end);
304   diff = end - begin;
305   if ((diff <= 300) && (factor_begin > 0.0) && (factor_end < 0.0))
306     return (true);
308   jq_obj.data ('begin', begin + (diff * factor_begin));
309   jq_obj.data ('end', end + (diff * factor_end));
311   return (zoom_redraw (jq_obj));
312 } /* }}} function zoom_relative */
314 function zoom_reference (graph_id) /* {{{ */
316   var jq_obj;
317   var end;
318   var begin;
320   jq_obj = $("#" + graph_id);
321   if (jq_obj == null)
322     return (false);
324   begin = jq_obj.data ('begin');
325   end = jq_obj.data ('end');
326   if ((begin == null) || (end == null))
327     return (false);
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 */
337 function zoom_earlier (graph_id) /* {{{ */
339   return (zoom_relative (graph_id, -0.2, -0.2));
340 } /* }}} function zoom_earlier */
342 function zoom_later (graph_id) /* {{{ */
344   return (zoom_relative (graph_id, +0.2, +0.2));
345 } /* }}} function zoom_later */
347 function zoom_in (graph_id) /* {{{ */
349   return (zoom_relative (graph_id, +0.2, -0.2));
350 } /* }}} function zoom_earlier */
352 function zoom_out (graph_id) /* {{{ */
354   return (zoom_relative (graph_id, (-1.0 / 3.0), (1.0 / 3.0)));
355 } /* }}} function zoom_earlier */
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 ();
362     $("#search-input").blur (function()
363     {
364       window.setTimeout (function ()
365       {
366         $("#search-suggest").hide ();
367       }, 500);
368     });
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     });
383     $("#search-input").keyup (function()
384     {
385       update_search_suggestions ();
386     });
388     var graph_count = 0;
389     $(".graph-img").each (function (index, elem)
390     {
391       var id = "graph" + graph_count;
392       graph_count++;
394       $(this).find ("img").each (function (img_index, img_elem)
395       {
396         var base_url;
398         $(this).attr ("id", id);
400         base_url = $(this).attr ("src").replace (/;(begin|end)=[^;]*/g, '');
401         $(this).data ("base_url", base_url);
402       });
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     });
421     var i;
422     for (i = 0; i < c4.instances.length; i++)
423     {
424       json_graph_update (i);
425     }
426 });
428 /* vim: set sw=2 sts=2 et fdm=marker : */