2cb6f306e28c841e2e75d8bb8b1a6bb05ff69f78
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)
105 {
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)
173 {
174 return ("<li class=\"instance\"><a href=\"" + location.pathname
175 + "?action=show_instance;" + inst.params + "\">" + inst.description
176 + "</a></li>");
177 }
179 function format_instance_list(instances)
180 {
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]);
190 ret += "</ul>";
192 return (ret);
193 }
195 function format_graph(graph)
196 {
197 return ("<li class=\"graph\">" + graph.title + format_instance_list (graph.instances) + "</li>");
198 }
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 }
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) /* {{{ */
226 {
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) /* {{{ */
242 {
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) /* {{{ */
261 {
262 zoom_reset (graph_id, 3600);
263 } /* }}} function zoom_hour */
265 function zoom_day (graph_id) /* {{{ */
266 {
267 zoom_reset (graph_id, 86400);
268 } /* }}} function zoom_day */
270 function zoom_week (graph_id) /* {{{ */
271 {
272 zoom_reset (graph_id, 7 * 86400);
273 } /* }}} function zoom_week */
275 function zoom_month (graph_id) /* {{{ */
276 {
277 zoom_reset (graph_id, 31 * 86400);
278 } /* }}} function zoom_month */
280 function zoom_year (graph_id) /* {{{ */
281 {
282 zoom_reset (graph_id, 366 * 86400);
283 } /* }}} function zoom_year */
285 function zoom_relative (graph_id, factor_begin, factor_end) /* {{{ */
286 {
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) /* {{{ */
315 {
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) /* {{{ */
338 {
339 return (zoom_relative (graph_id, -0.2, -0.2));
340 } /* }}} function zoom_earlier */
342 function zoom_later (graph_id) /* {{{ */
343 {
344 return (zoom_relative (graph_id, +0.2, +0.2));
345 } /* }}} function zoom_later */
347 function zoom_in (graph_id) /* {{{ */
348 {
349 return (zoom_relative (graph_id, +0.2, -0.2));
350 } /* }}} function zoom_earlier */
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 */
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 : */