tyler.durden
/
pandorafms
mirror of https://github.com/pandorafms/pandorafms.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

2013-02-06 Miguel de Dios <miguel.dedios@artica.es> 

* include/graphs/flot/pandora.flot.js: cleaned source code style.
	
	* include/graphs/functions_utils.php: fixed the unasigned var.
	
	Fixes: #3603439




git-svn-id: https://svn.code.sf.net/p/pandora/code/trunk@7597 c3f86ba8-e40f-0410-aaad-9ba5e7f4b01f
This commit is contained in:
mdtrooper 2013-02-06 15:18:08 +00:00
parent 5767594f30
commit db0aab59c0
3 changed files with 178 additions and 170 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
pandora_console/ChangeLog
View File

@ -1,3 +1,11 @@
2013-02-06 Miguel de Dios <miguel.dedios@artica.es>
* include/graphs/flot/pandora.flot.js: cleaned source code style.
* include/graphs/functions_utils.php: fixed the unasigned var.
Fixes: #3603439
2013-02-06 Miguel de Dios <miguel.dedios@artica.es> 2013-02-06 Miguel de Dios <miguel.dedios@artica.es>
* include/functions_graph.php, include/functions_ui.php, * include/functions_graph.php, include/functions_ui.php,

338
pandora_console/include/graphs/flot/pandora.flot.js
View File

@ -125,14 +125,14 @@ function pandoraFlotHBars(graph_id, values, labels, water_mark, maxvalue, water_
} }
labels = labels.split(separator).reverse(); labels = labels.split(separator).reverse();
var stack = 0, bars = true, lines = false, steps = false; var stack = 0, bars = true, lines = false, steps = false;
var options = { var options = {
series: { series: {
shadowSize: 0.1 shadowSize: 0.1
}, },
grid: { grid: {
hoverable: true, hoverable: true,
borderWidth:1, borderWidth:1,
@ -159,13 +159,13 @@ function pandoraFlotHBars(graph_id, values, labels, water_mark, maxvalue, water_
legend: { legend: {
show: false show: false
} }
}; };
var plot = $.plot($('#'+graph_id),datas, options ); var plot = $.plot($('#'+graph_id),datas, options );
// Adjust the top of yaxis tick to set it in the middle of the bars // Adjust the top of yaxis tick to set it in the middle of the bars
yAxisHeight = $('#'+graph_id+' .yAxis .tickLabel').css('height').split('px')[0]; yAxisHeight = $('#'+graph_id+' .yAxis .tickLabel').css('height').split('px')[0];
i = 0; i = 0;
$('#'+graph_id+' .yAxis .tickLabel').each(function() { $('#'+graph_id+' .yAxis .tickLabel').each(function() {
tickTop = $(this).css('top').split('px')[0]; tickTop = $(this).css('top').split('px')[0];
@ -175,7 +175,7 @@ function pandoraFlotHBars(graph_id, values, labels, water_mark, maxvalue, water_
valuesNewTop = parseInt(parseInt(tickTop) - (yAxisHeight)); valuesNewTop = parseInt(parseInt(tickTop) - (yAxisHeight));
$('#value_'+i+'_'+graph_id).css('top',parseInt(plot.offset().top) + parseInt(valuesNewTop)); $('#value_'+i+'_'+graph_id).css('top',parseInt(plot.offset().top) + parseInt(valuesNewTop));
pixelPerValue = parseInt(plot.width()) / maxvalue; pixelPerValue = parseInt(plot.width()) / maxvalue;
inCanvasValuePos = parseInt(pixelPerValue * ($('#value_'+i+'_'+graph_id).html())); inCanvasValuePos = parseInt(pixelPerValue * ($('#value_'+i+'_'+graph_id).html()));
@ -195,35 +195,35 @@ function pandoraFlotHBars(graph_id, values, labels, water_mark, maxvalue, water_
$('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3); $('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3);
i++; i++;
}); });
}); });
// Format functions // Format functions
function xFormatter(v, axis) { function xFormatter(v, axis) {
if(labels[v] != undefined) { if (labels[v] != undefined) {
return labels[v]; return labels[v];
} }
else { else {
return ''; return '';
} }
} }
function yFormatter(v, axis) { function yFormatter(v, axis) {
return v; return v;
} }
function lFormatter(v, axis) { function lFormatter(v, axis) {
return '<div style=color:#000>'+v+'</div>'; return '<div style=color:#000>'+v+'</div>';
} }
// Events // Events
$('#'+graph_id).bind('plothover', function (event, pos, item) { $('#'+graph_id).bind('plothover', function (event, pos, item) {
$('.values_'+graph_id).css('font-weight', ''); $('.values_'+graph_id).css('font-weight', '');
if(item != null) { if(item != null) {
index = item.dataIndex; index = item.dataIndex;
$('#value_'+index+'_'+graph_id).css('font-weight', 'bold'); $('#value_'+index+'_'+graph_id).css('font-weight', 'bold');
} }
}); });
if(water_mark) { if(water_mark) {
set_watermark(graph_id, plot, $('#watermark_image_'+graph_id).attr('src')); set_watermark(graph_id, plot, $('#watermark_image_'+graph_id).attr('src'));
} }
@ -235,7 +235,7 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
legend = legend.split(separator); legend = legend.split(separator);
labels_long = labels_long.split(separator); labels_long = labels_long.split(separator);
colors = colors.split(separator); colors = colors.split(separator);
var datas = new Array(); var datas = new Array();
for(i=0;i<values.length;i++) { for(i=0;i<values.length;i++) {
@ -262,9 +262,9 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
} }
labels = labels.split(separator); labels = labels.split(separator);
var stack = 0, bars = true, lines = false, steps = false; var stack = 0, bars = true, lines = false, steps = false;
var options = { var options = {
series: { series: {
shadowSize: 0.1 shadowSize: 0.1
@ -286,23 +286,23 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
color: '#000' color: '#000'
}, },
{ {
// align if we are to the right // align if we are to the right
alignTicksWithAxis: 1, alignTicksWithAxis: 1,
position: 'right', position: 'right',
//tickFormatter: dFormatter //tickFormatter: dFormatter
} ] } ]
, ,
legend: { legend: {
show: false show: false
} }
}; };
var plot = $.plot($('#'+graph_id),datas, options ); var plot = $.plot($('#'+graph_id),datas, options );
// Adjust the top of yaxis tick to set it in the middle of the bars // Adjust the top of yaxis tick to set it in the middle of the bars
yAxisHeight = $('#'+graph_id+' .yAxis .tickLabel').css('height').split('px')[0]; yAxisHeight = $('#'+graph_id+' .yAxis .tickLabel').css('height').split('px')[0];
i = 0; i = 0;
//~ $('#'+graph_id+' .yAxis .tickLabel').each(function() { //~ $('#'+graph_id+' .yAxis .tickLabel').each(function() {
//~ tickTop = $(this).css('top').split('px')[0]; //~ tickTop = $(this).css('top').split('px')[0];
@ -332,28 +332,28 @@ function pandoraFlotVBars(graph_id, values, labels, labels_long, legend, colors,
//~ $('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3); //~ $('#value_'+i+'_'+graph_id).css('left',plot.offset().left + inCanvasValuePos - $('#value_'+i+'_'+graph_id).css('width').split('px')[0] - 3);
//~ i++; //~ i++;
//~ }); //~ });
//~ }); //~ });
// Format functions // Format functions
function xFormatter(v, axis) { function xFormatter(v, axis) {
if(labels[v] != undefined) { if(labels[v] != undefined) {
return labels[v]; return labels[v];
} }
else { else {
return ''; return '';
} }
} }
function yFormatter(v, axis) { function yFormatter(v, axis) {
return v; return v;
} }
function lFormatter(v, axis) { function lFormatter(v, axis) {
return '<div style=color:#000>'+v+'</div>'; return '<div style=color:#000>'+v+'</div>';
} }
// Events // Events
//~ $('#'+graph_id).bind('plothover', function (event, pos, item) { //~ $('#'+graph_id).bind('plothover', function (event, pos, item) {
//~ $('.values_'+graph_id).css('font-weight', ''); //~ $('.values_'+graph_id).css('font-weight', '');
//~ if(item != null) { //~ if(item != null) {
//~ index = item.dataIndex; //~ index = item.dataIndex;
@ -393,7 +393,7 @@ function pandoraFlotSlicebar(graph_id, values, datacolor, labels, legend, acumul
} }
var stack = 0, bars = true, lines = false, steps = false; var stack = 0, bars = true, lines = false, steps = false;
var options = { var options = {
series: { series: {
stack: stack, stack: stack,
@ -419,12 +419,12 @@ function pandoraFlotSlicebar(graph_id, values, datacolor, labels, legend, acumul
legend: { legend: {
show: false show: false
} }
}; };
var plot = $.plot($('#'+graph_id), datas, options ); var plot = $.plot($('#'+graph_id), datas, options );
// Events // Events
$('#'+graph_id).bind('plothover', function (event, pos, item) { $('#'+graph_id).bind('plothover', function (event, pos, item) {
if(item) { if(item) {
var from = legend[item.seriesIndex]; var from = legend[item.seriesIndex];
var to = legend[item.seriesIndex+1]; var to = legend[item.seriesIndex+1];
@ -438,27 +438,27 @@ function pandoraFlotSlicebar(graph_id, values, datacolor, labels, legend, acumul
var extra_width = parseInt($('#extra_'+graph_id).css('width').split('px')[0]); var extra_width = parseInt($('#extra_'+graph_id).css('width').split('px')[0]);
$('#extra_'+graph_id).css('left',pos.pageX-(extra_width/2)+'px'); $('#extra_'+graph_id).css('left',pos.pageX-(extra_width/2)+'px');
$('#extra_'+graph_id).css('top',plot.offset().top-extra_height-5+'px'); $('#extra_'+graph_id).css('top',plot.offset().top-extra_height-5+'px');
$('#extra_'+graph_id).show(); $('#extra_'+graph_id).show();
} }
}); });
$('#'+graph_id).bind('mouseout',resetInteractivity); $('#'+graph_id).bind('mouseout',resetInteractivity);
// Reset interactivity styles // Reset interactivity styles
function resetInteractivity() { function resetInteractivity() {
$('#extra_'+graph_id).hide(); $('#extra_'+graph_id).hide();
} }
// Format functions // Format functions
function xFormatter(v, axis) { function xFormatter(v, axis) {
for(i = 0; i < acumulate_data.length; i++) { for(i = 0; i < acumulate_data.length; i++) {
if(acumulate_data[i] == v) { if(acumulate_data[i] == v) {
return '<span style=\'font-size: 6pt\'>' + legend[i] + '</span>'; return '<span style=\'font-size: 6pt\'>' + legend[i] + '</span>';
} }
} }
return ''; return '';
} }
} }
function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors, type, serie_types, water_mark, width, max_x, homeurl, unit, font_size, menu, events, event_ids, legend_events, alerts, alert_ids, legend_alerts, yellow_threshold, red_threshold, force_integer, separator, separator2, series_suffix_str) { function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors, type, serie_types, water_mark, width, max_x, homeurl, unit, font_size, menu, events, event_ids, legend_events, alerts, alert_ids, legend_alerts, yellow_threshold, red_threshold, force_integer, separator, separator2, series_suffix_str) {
@ -479,7 +479,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
alerts = []; alerts = [];
alert_ids = alert_ids.split(separator); alert_ids = alert_ids.split(separator);
colors = colors.split(separator); colors = colors.split(separator);
var eventsz = new Array(); var eventsz = new Array();
$.each(events,function(i,v) { $.each(events,function(i,v) {
eventsz[event_ids[i]] = v; eventsz[event_ids[i]] = v;
@ -512,7 +512,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
var datas = new Array(); var datas = new Array();
var data_base = new Array(); var data_base = new Array();
// Prepared to turn series with a checkbox // Prepared to turn series with a checkbox
// var showed = new Array(); // var showed = new Array();
for(i=0;i<values.length;i++) { for(i=0;i<values.length;i++) {
@ -539,7 +539,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
points_show = true; points_show = true;
break; break;
} }
var serie_color; var serie_color;
if(colors[i] != '') { if(colors[i] != '') {
serie_color = colors[i]; serie_color = colors[i];
@ -547,7 +547,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
else { else {
serie_color = null; serie_color = null;
} }
var normalw = '#efe'; var normalw = '#efe';
var warningw = '#ffe'; var warningw = '#ffe';
var criticalw = '#fee'; var criticalw = '#fee';
@ -578,7 +578,7 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
lines: { show: line_show, fill: filled, fillColor: { colors: [ { opacity: 0.9 }, { opacity: 0.9 } ]}, lineWidth:1, steps:false }, lines: { show: line_show, fill: filled, fillColor: { colors: [ { opacity: 0.9 }, { opacity: 0.9 } ]}, lineWidth:1, steps:false },
points: { show: points_show } points: { show: points_show }
}); });
// Prepared to turn series with a checkbox // Prepared to turn series with a checkbox
// showed[i] = true; // showed[i] = true;
} }
@ -605,12 +605,12 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
// The first execution, the graph data is the base data // The first execution, the graph data is the base data
datas = data_base; datas = data_base;
// minTickSize // minTickSize
var count_data = datas[0].data.length; var count_data = datas[0].data.length;
var min_tick_pixels = 80; var min_tick_pixels = 80;
var steps = parseInt( count_data / (width/min_tick_pixels)); var steps = parseInt( count_data / (width/min_tick_pixels));
var options = { var options = {
series: { series: {
stack: stacked, stack: stacked,
@ -649,110 +649,110 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
container: $('#legend_'+graph_id), container: $('#legend_'+graph_id),
labelFormatter: lFormatter labelFormatter: lFormatter
} }
}; };
var stack = 0, bars = true, lines = false, steps = false; var stack = 0, bars = true, lines = false, steps = false;
var plot = $.plot($('#'+graph_id), datas, options); var plot = $.plot($('#'+graph_id), datas, options);
// Adjust the overview plot to the width and position of the main plot // Adjust the overview plot to the width and position of the main plot
adjust_left_width_canvas(graph_id, 'overview_'+graph_id); adjust_left_width_canvas(graph_id, 'overview_'+graph_id);
// Adjust linked graph to the width and position of the main plot // Adjust linked graph to the width and position of the main plot
// Miniplot // Miniplot
var overview = $.plot($('#overview_'+graph_id),datas, { var overview = $.plot($('#overview_'+graph_id),datas, {
series: { series: {
stack: stacked, stack: stacked,
lines: { show: true, lineWidth: 1 }, lines: { show: true, lineWidth: 1 },
shadowSize: 0 shadowSize: 0
}, },
grid: { borderWidth: 1, hoverable: true, autoHighlight: false}, grid: { borderWidth: 1, hoverable: true, autoHighlight: false},
xaxis: { }, xaxis: { },
xaxes: [ { xaxes: [ {
tickFormatter: xFormatter, tickFormatter: xFormatter,
minTickSize: steps, minTickSize: steps,
color: '#000' color: '#000'
} ], } ],
yaxis: { ticks: [], min: 0, autoscaleMargin: 0.1 }, yaxis: { ticks: [], min: 0, autoscaleMargin: 0.1 },
selection: { mode: 'x', color: '#777' }, selection: { mode: 'x', color: '#777' },
legend: {show: false}, legend: {show: false},
crosshair: { mode: 'x' } crosshair: { mode: 'x' }
}); });
// Connection between plot and miniplot // Connection between plot and miniplot
$('#'+graph_id).bind('plotselected', function (event, ranges) { $('#'+graph_id).bind('plotselected', function (event, ranges) {
// do the zooming // do the zooming
dataInSelection = ranges.xaxis.to - ranges.xaxis.from; dataInSelection = ranges.xaxis.to - ranges.xaxis.from;
dataInPlot = plot.getData()[0].data.length; dataInPlot = plot.getData()[0].data.length;
factor = dataInSelection / dataInPlot; factor = dataInSelection / dataInPlot;
new_steps = parseInt(factor*steps); new_steps = parseInt(factor*steps);
plot = $.plot($('#'+graph_id), datas, plot = $.plot($('#'+graph_id), datas,
$.extend(true, {}, options, { $.extend(true, {}, options, {
xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to}, xaxis: { min: ranges.xaxis.from, max: ranges.xaxis.to},
xaxes: [ { xaxes: [ {
tickFormatter: xFormatter, tickFormatter: xFormatter,
minTickSize: new_steps, minTickSize: new_steps,
color: '#000' color: '#000'
} ], } ],
legend: { show: false }, legend: { show: false },
})); }));
$('#menu_cancelzoom_'+graph_id).attr('src',homeurl+'/images/zoom_cross.png'); $('#menu_cancelzoom_'+graph_id).attr('src',homeurl+'/images/zoom_cross.png');
currentRanges = ranges; currentRanges = ranges;
// don't fire event on the overview to prevent eternal loop // don't fire event on the overview to prevent eternal loop
overview.setSelection(ranges, true); overview.setSelection(ranges, true);
}); });
$('#overview_'+graph_id).bind('plotselected', function (event, ranges) { $('#overview_'+graph_id).bind('plotselected', function (event, ranges) {
plot.setSelection(ranges); plot.setSelection(ranges);
}); });
var legends = $('#legend_'+graph_id+' .legendLabel'); var legends = $('#legend_'+graph_id+' .legendLabel');
var updateLegendTimeout = null; var updateLegendTimeout = null;
var latestPosition = null; var latestPosition = null;
var currentPlot = null; var currentPlot = null;
var currentRanges = null; var currentRanges = null;
// Update legend with the data of the plot in the mouse position // Update legend with the data of the plot in the mouse position
function updateLegend() { function updateLegend() {
updateLegendTimeout = null; updateLegendTimeout = null;
var pos = latestPosition; var pos = latestPosition;
var axes = currentPlot.getAxes(); var axes = currentPlot.getAxes();
if (pos.x < axes.xaxis.min || pos.x > axes.xaxis.max || if (pos.x < axes.xaxis.min || pos.x > axes.xaxis.max ||
pos.y < axes.yaxis.min || pos.y > axes.yaxis.max) { pos.y < axes.yaxis.min || pos.y > axes.yaxis.max) {
return; return;
} }
var j, dataset = currentPlot.getData(); var j, dataset = currentPlot.getData();
var i = 0; var i = 0;
for (k = 0; k < dataset.length; k++) { for (k = 0; k < dataset.length; k++) {
// k is the real series counter // k is the real series counter
// i is the series counter without thresholds // i is the series counter without thresholds
var series = dataset[k]; var series = dataset[k];
if(series.label == null) { if(series.label == null) {
continue; continue;
} }
// find the nearest points, x-wise // find the nearest points, x-wise
for (j = 0; j < series.data.length; ++j) for (j = 0; j < series.data.length; ++j)
if (series.data[j][0] > pos.x) { if (series.data[j][0] > pos.x) {
break; break;
} }
var y = series.data[j][1]; var y = series.data[j][1];
if(currentRanges == null || (currentRanges.xaxis.from < j && j < currentRanges.xaxis.to)) { if(currentRanges == null || (currentRanges.xaxis.from < j && j < currentRanges.xaxis.to)) {
$('#timestamp_'+graph_id).show(); $('#timestamp_'+graph_id).show();
// If no legend, the timestamp labels are short and with value // If no legend, the timestamp labels are short and with value
@ -772,9 +772,9 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
} }
var timenewpos = dataset[0].xaxis.p2c(pos.x)+plot.offset().left; var timenewpos = dataset[0].xaxis.p2c(pos.x)+plot.offset().left;
var canvaslimit = plot.offset().left + plot.width(); var canvaslimit = plot.offset().left + plot.width();
if(timesize+timenewpos > canvaslimit) { if(timesize+timenewpos > canvaslimit) {
$('#timestamp_'+graph_id).css('left', timenewpos - timesize); $('#timestamp_'+graph_id).css('left', timenewpos - timesize);
} }
@ -785,31 +785,31 @@ function pandoraFlotArea(graph_id, values, labels, labels_long, legend, colors,
else { else {
$('#timestamp_'+graph_id).hide(); $('#timestamp_'+graph_id).hide();
} }
var label_aux = series.label + ' = '; var label_aux = series.label + ' = ';
if(serie_types[i] != 'points') { if (serie_types[i] != 'points') {
legends.eq(i).text(label_aux.replace(/=.*/, '= ' + parseFloat(y).toFixed(2) +' '+unit)); legends.eq(i).text(label_aux.replace(/=.*/, '= ' + parseFloat(y).toFixed(2) +' '+unit));
} }
legends.eq(i).css('font-size',font_size+'pt'); legends.eq(i).css('font-size',font_size+'pt');
legends.eq(i).css('color','#000'); legends.eq(i).css('color','#000');
i++; i++;
} }
} }
// Events // Events
$('#'+graph_id).bind('plothover', function (event, pos, item) { $('#'+graph_id).bind('plothover', function (event, pos, item) {
overview.setCrosshair({ x: pos.x, y: 0 }); overview.setCrosshair({ x: pos.x, y: 0 });
currentPlot = plot; currentPlot = plot;
latestPosition = pos; latestPosition = pos;
if (!updateLegendTimeout) { if (!updateLegendTimeout) {
updateLegendTimeout = setTimeout(updateLegend, 50); updateLegendTimeout = setTimeout(updateLegend, 50);
} }
}); });
$('#'+graph_id).bind("plotclick", function (event, pos, item) { $('#'+graph_id).bind("plotclick", function (event, pos, item) {
plot.unhighlight(); plot.unhighlight();
if (item && item.series.label != '' && (item.series.label == legend_events || item.series.label == legend_events+series_suffix_str || item.series.label == legend_alerts || item.series.label == legend_alerts+series_suffix_str)) { if (item && item.series.label != '' && (item.series.label == legend_events || item.series.label == legend_events+series_suffix_str || item.series.label == legend_alerts || item.series.label == legend_alerts+series_suffix_str)) {

2
pandora_console/include/graphs/functions_utils.php
View File

@ -134,7 +134,7 @@ function graph_get_max_index($legend_values) {
function setup_watermark($water_mark, &$water_mark_file, &$water_mark_url) { function setup_watermark($water_mark, &$water_mark_file, &$water_mark_url) {
if (!is_array($water_mark)) { if (!is_array($water_mark)) {
$water_mark['file'] = $water_mark; $water_mark_file = $water_mark;
} }
if (isset($water_mark['file'])) { if (isset($water_mark['file'])) {