2011-01-19 Miguel de Dios <miguel.dedios@artica.es>

* include/functions_visual_map.php, 
	godmode/reporting/visual_console_builder.editor.js,
	godmode/reporting/visual_console_builder.editor.php: fixed the resize
	background, and now the visualmap the background resize. And now the items
	move with resize the background.
	
	Fixes: #3156131
	
	Pending task: #2996500



git-svn-id: https://svn.code.sf.net/p/pandora/code/trunk@3750 c3f86ba8-e40f-0410-aaad-9ba5e7f4b01f
This commit is contained in:
mdtrooper 2011-01-19 20:08:18 +00:00
parent e0d267078a
commit 3a02320e3f
4 changed files with 194 additions and 34 deletions

View File

@ -1,3 +1,15 @@
2011-01-19 Miguel de Dios <miguel.dedios@artica.es>
* include/functions_visual_map.php,
godmode/reporting/visual_console_builder.editor.js,
godmode/reporting/visual_console_builder.editor.php: fixed the resize
background, and now the visualmap the background resize. And now the items
move with resize the background.
Fixes: #3156131
Pending task: #2996500
2011-01-19 Javier Lanz <javier.lanz@artica.es>
* extensions/module_groups.php: Added truncation and scroll bar
* operation/agentes/status_monitor.php: Fixed combobox functionality

View File

@ -123,7 +123,8 @@ function updateAction() {
$("#background").css('width', values['width']);
$("#background").css('height', values['height']);
$("#background").css('background', 'url(images/console/background/' + values['background'] + ')');
//$("#background").css('background', 'url(images/console/background/' + values['background'] + ')');
$("#background_img").attr('src', 'images/console/background/' + values['background']);
var idElement = 0;
break;
case 'static_graph':
@ -379,6 +380,66 @@ function loadFieldsFromDB(item) {
});
}
function setOriginalSizeBackground() {
$.ajax({
type: "POST",
url: "ajax.php",
data: "page=godmode/reporting/visual_console_builder.editor&get_original_size_background=1&background=" + $("#background_img").attr('src'),
async:false,
dataType: "json",
success: function(data){
var values = {};
values['width'] = data[0];
values['height'] = data[1];
updateDB('background', 0, values);
}
});
actionClick();
}
function setAspectRatioBackground(side) {
$.ajax({
type: "POST",
url: "ajax.php",
data: "page=godmode/reporting/visual_console_builder.editor&get_original_size_background=1&background=" + $("#background_img").attr('src'),
async:false,
dataType: "json",
success: function(data){
old_width = parseInt($("#background").css('width').replace('px', ''));
old_height = parseInt($("#background").css('height').replace('px', ''));
img_width = data[0];
img_height = data[1];
if (side == 'width') {
ratio = old_width / img_width;
width = old_width;
height = img_height * ratio;
}
else if (side == 'height') {
ratio = old_height / img_height;
width = img_width * ratio;
height = old_height;
}
var values = {};
values['width'] = width;
values['height'] = height;
updateDB('background', 0, values);
}
});
actionClick();
}
function hiddenFields(item) {
$(".title_panel_span").css('display', 'none');
$("#title_panel_span_" + item).css('display', 'inline');
@ -401,8 +462,17 @@ function hiddenFields(item) {
$("#module_row").css('display', 'none');
$("#module_row." + item).css('display', '');
$("#background_row").css('display', 'none');
$("#background_row." + item).css('display', '');
$("#background_row_1").css('display', 'none');
$("#background_row_1." + item).css('display', '');
$("#background_row_2").css('display', 'none');
$("#background_row_2." + item).css('display', '');
$("#background_row_3").css('display', 'none');
$("#background_row_3." + item).css('display', '');
$("#background_row_4").css('display', 'none');
$("#background_row_4." + item).css('display', '');
$("#percentile_bar_row_1").css('display', 'none');
$("#percentile_bar_row_1." + item).css('display', '');
@ -586,7 +656,7 @@ function createItem(type, values, id_data) {
var sizeStyle = 'width: ' + values['width'] + 'px; height: ' + values['height'] + 'px;';
var imageSize = 'width="' + values['width'] + '" height="' + values['height'] + '"';
}
var item = $('<div id="' + id_data + '" class="item static_graph" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item static_graph" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<img id="image_' + id_data + '" class="image" src="' + getImageElement(id_data) + '" ' + imageSize + ' /><br />' +
'<span id="text_' + id_data + '" class="text">' + values['label'] + '</span>' +
'</div>'
@ -596,7 +666,7 @@ function createItem(type, values, id_data) {
var sizeStyle = '';
var imageSize = '';
var item = $('<div id="' + id_data + '" class="item percentile_bar" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item percentile_bar" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<span id="text_' + id_data + '" class="text">' + values['label'] + '</span><br />' +
'<img class="image" id="image_' + id_data + '" src="' + getPercentileBar(id_data) + '" />' +
'</div>'
@ -606,7 +676,7 @@ function createItem(type, values, id_data) {
var sizeStyle = '';
var imageSize = '';
var item = $('<div id="' + id_data + '" class="item module_graph" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item module_graph" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<span id="text_' + id_data + '" class="text">' + values['label'] + '</span><br />' +
'<img class="image" id="image_' + id_data + '" src="' + getModuleGraph(id_data) + '" style="border:1px solid #808080;" />' +
'</div>'
@ -616,14 +686,14 @@ function createItem(type, values, id_data) {
var sizeStyle = '';
var imageSize = '';
var item = $('<div id="' + id_data + '" class="item simple_value" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item simple_value" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<span id="text_' + id_data + '" class="text"> ' + values['label'] + '</span>' +
'<strong>' + getModuleValue(id_data) + '</strong>' +
'</div>'
);
break;
case 'label':
var item = $('<div id="' + id_data + '" class="item label" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item label" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<span id="text_' + id_data + '" class="text">' + values['label'] + '</span>' +
'</div>'
);
@ -637,7 +707,7 @@ function createItem(type, values, id_data) {
var sizeStyle = 'width: ' + values['width'] + 'px; height: ' + values['height'] + 'px;';
var imageSize = 'width="' + values['width'] + '" height="' + values['height'] + '"';
}
var item = $('<div id="' + id_data + '" class="item static_graph" style="color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
var item = $('<div id="' + id_data + '" class="item static_graph" style="left: 0px; top: 0px; color: ' + values['label_color'] + '; text-align: center; position: absolute; ' + sizeStyle + ' margin-top: ' + values['top'] + 'px; margin-left: ' + values['left'] + 'px;">' +
'<img id="image_' + id_data + '" class="image" src="' + getImageElement(id_data) + '" ' + imageSize + ' /><br />' +
'</div>'
);
@ -711,10 +781,15 @@ function updateDB(type, idElement , values) {
top = top + parseInt(values['mov_top']);
left = left + parseInt(values['mov_left']);
parameter.push ({name: 'top', value: top});
parameter.push ({name: 'left', value: left});
}
else if ((typeof(values['absolute_left']) != 'undefined') &&
(typeof(values['absolute_top']) != 'undefined')) {
var top = values['absolute_top'];
var left = values['absolute_left'];
}
parameter.push ({name: 'top', value: top});
parameter.push ({name: 'left', value: left});
jQuery.ajax({
url: "ajax.php",
@ -735,6 +810,11 @@ function updateDB(type, idElement , values) {
$("#" + idElement).css('top', '0px').css('margin-top', top + 'px');
$("#" + idElement).css('left', '0px').css('margin-left', left + 'px');
}
else if ((typeof(values['absolute_left']) != 'undefined') &&
(typeof(values['absolute_top']) != 'undefined')) {
$("#" + idElement).css('top', '0px').css('margin-top', top + 'px');
$("#" + idElement).css('left', '0px').css('margin-left', left + 'px');
}
$("#" + idElement).css('color', values['label_color']);
jQuery.each(lines, function(i, line) {
if (lines[i]['id'] == idElement) {
@ -743,7 +823,11 @@ function updateDB(type, idElement , values) {
}
else {
if ((typeof(values['mov_left']) == 'undefined') &&
(typeof(values['mov_top']) == 'undefined')) {
(typeof(values['mov_top']) == 'undefined') &&
(typeof(values['absolute_left']) == 'undefined') &&
(typeof(values['absolute_top']) == 'undefined')) {
console.log(666);
console.log(values['parent']);
lines[i]['node_begin'] = values['parent'];
}
}
@ -954,6 +1038,33 @@ function eventsItems() {
});
}
function move_elements_resize(original_width, original_height, width, height) {
jQuery.each($(".item"), function(key, value) {
item = value;
idItem = $(item).attr('id');
classItem = $(item).attr('class').replace('item', '').replace('ui-draggable', '').replace(/^\s+/g,'').replace(/\s+$/g,'')
old_height = parseInt($(item).css('margin-top').replace('px', ''));
old_width = parseInt($(item).css('margin-left').replace('px', ''));
ratio_width = width / original_width;
ratio_height = height / original_height;
new_height = old_height * ratio_height;
new_width = old_width * ratio_width;
//$(item).css('margin-top', new_height);
//$(item).css('margin-left', new_width);
var values = {};
values['absolute_left'] = new_width;
values['absolute_top'] = new_height;
updateDB(classItem, idItem, values);
});
}
function eventsBackground() {
$("#background").resizable();
@ -972,6 +1083,14 @@ function eventsBackground() {
values['height'] = $('#background').css('height').replace('px', '');
updateDB('background', 0, values);
width = ui.size['width'];
height = ui.size['height'];
original_width = ui.originalSize['width'];
original_height = ui.originalSize['height'];
move_elements_resize(original_width, original_height, width, height);
}
});

View File

@ -27,6 +27,17 @@ if (! give_acl ($config['id_user'], 0, "IW")) {
require_once('godmode/reporting/visual_console_builder.constans.php');
require_once ('include/functions_visual_map.php');
if (is_ajax ()) {
$get_original_size_background = get_parameter('get_original_size_background', false);
if ($get_original_size_background) {
$background = get_parameter('background', '');
$size = getimagesize($background);
echo json_encode($size);
return;
}
}
//Arrays for select box.
$backgrounds_list = list_files('images/console/background/', "jpg", 1, 0);
$backgrounds_list = array_merge($backgrounds_list, list_files ('images/console/background/', "png", 1, 0));
@ -121,10 +132,22 @@ echo '<div id="properties_panel" style="display: none; position: absolute; borde
<td><?php echo __('Module');?></td>
<td><?php print_select (array (), 'module', '', '', __('Any'), 0);?></td>
</tr>
<tr id="background_row" class="background datos">
<tr id="background_row_1" class="background datos">
<td><?php echo __('Background');?></td>
<td><?php print_select($backgrounds_list, 'background_image', $background, '', 'None', '');?></td>
</tr>
<tr id="background_row_2" class="background datos">
<td><?php echo __('Original Size');?></td>
<td><?php print_button(__('Apply'), 'original_false', false, 'setOriginalSizeBackground()', 'class="sub"');?></td>
</tr>
<tr id="background_row_3" class="background datos">
<td><?php echo __('Aspect ratio');?></td>
<td><?php print_button(__('Width proportional'), 'original_false', false, "setAspectRatioBackground('width')", 'class="sub"');?></td>
</tr>
<tr id="background_row_4" class="background datos">
<td></td>
<td><?php print_button(__('Height proportional'), 'original_false', false, "setAspectRatioBackground('height')", 'class="sub"');?></td>
</tr>
<tr id="percentile_bar_row_1" class="percentile_bar datos">
<td><?php echo __('Width');?></td>
<td>
@ -222,8 +245,11 @@ echo '<div id="properties_panel" style="display: none; position: absolute; borde
//------------------------------------------------------------------------------
echo '</div>';
echo '<div id="frame_view" style="width: 100%; height: 500px; overflow: scroll;">';
echo '<div id="background" class="ui-widget-content" style="background: url(images/console/background/' . $background . ');
//echo '<div id="background" class="ui-widget-content" style="background: url(images/console/background/' . $background . ');
// border: 2px black solid; width: ' . $widthBackground . 'px; height: ' . $heightBackground . 'px;">';
echo '<div id="background" class="ui-widget-content" style="
border: 2px black solid; width: ' . $widthBackground . 'px; height: ' . $heightBackground . 'px;">';
echo "<img id='background_img' src='images/console/background/" . $background . "' width='100%' height='100%' />";
foreach ($layoutDatas as $layoutData) {

View File

@ -80,7 +80,9 @@ function printItemInVisualConsole($layoutData) {
$sizeStyle = 'width: ' . $width . 'px; height: ' . $height . 'px;';
$imageSize = 'width="' . $width . '" height="' . $height . '"';
}
echo '<div id="' . $id . '" class="item static_graph" style="text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '"
class="item static_graph"
style="left: 0px; top: 0px; text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
if ($layoutData['image'] != null) {
echo '<img class="image" id="image_' . $id . '" src="' . $img . '" ' . $imageSize . ' style="'.$borderStyle.'" /><br />';
}
@ -97,7 +99,7 @@ function printItemInVisualConsole($layoutData) {
$img = '<img class="image" id="image_' . $id . '" src="include/fgraph.php?tipo=progress&height=15&width=' . $width . '&mode=1&percent=' . $percentile . '" />';
echo '<div id="' . $id . '" class="item percentile_bar" style="color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '" class="item percentile_bar" style="left: 0px; top: 0px; color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo $text . '<br />';
echo $img;
echo '</div>';
@ -106,19 +108,19 @@ function printItemInVisualConsole($layoutData) {
case MODULE_GRAPH:
$img = '<img class="image" id="image_' . $id . '" src="include/fgraph.php?tipo=sparse&id=' . $id_module . '&label=' . base64_encode ($label) . '&height=' . $height . '&pure=1&width=' . $width . '&period=' . $period . ' " style="border:1px solid #808080;" />';
echo '<div id="' . $id . '" class="item module_graph" style="color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '" class="item module_graph" style="left: 0px; top: 0px; color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo $text . '<br />';
echo $img;
echo '</div>';
break;
case SIMPLE_VALUE:
echo '<div id="' . $id . '" class="item simple_value" style="color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '" class="item simple_value" style="left: 0px; top: 0px; color: ' . $color . '; text-align: center; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo $text;
echo ' <strong>' . get_db_value ('datos', 'tagente_estado', 'id_agente_modulo', $id_module) . '</strong>';
echo '</div>';
break;
case LABEL:
echo '<div id="' . $id . '" class="item label" style="text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '" class="item label" style="left: 0px; top: 0px; text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo $text;
echo "</div>";
break;
@ -131,7 +133,7 @@ function printItemInVisualConsole($layoutData) {
$sizeStyle = 'width: ' . $width . 'px; height: ' . $height . 'px;';
$imageSize = 'width="' . $width . '" height="' . $height . '"';
}
echo '<div id="' . $id . '" class="item icon" style="text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
echo '<div id="' . $id . '" class="item icon" style="left: 0px; top: 0px; text-align: center; color: ' . $color . '; position: absolute; ' . $sizeStyle . ' margin-top: ' . $top . 'px; margin-left: ' . $left . 'px;">';
if ($layoutData['image'] != null) {
echo '<img class="image" id="image_' . $id . '" src="' . $img . '" ' . $imageSize . ' /><br />';
}
@ -400,7 +402,8 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
}
echo '<div id="layout_map"
style="z-index: 0; position:relative; background: url(\'' . $backgroundImage .'\'); width:'.$mapWidth.'px; height:'.$mapHeight.'px;">';
style="z-index: 0; position:relative; width:'.$mapWidth.'px; height:'.$mapHeight.'px;">';
echo "<img src='" . $backgroundImage . "' width='100%' height='100%' />";
$layout_datas = get_db_all_rows_field_filter ('tlayout_data', 'id_layout', $id_layout);
$lines = array ();
@ -494,9 +497,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// Draw image
if ($resizedMap)
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
if (!isset ($id_agent))
$id_agent = 0;
@ -597,9 +600,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// ****************************************************************
$z_index = 4;
if ($resizedMap)
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
$endTagA = false;
if ($show_links) {
@ -628,9 +631,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// ****************************************************************
$z_index = 4;
if ($resizedMap)
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: '.$z_index.'; '.($layout_data['label_color'][0] == '#' ? 'color: '.$layout_data['label_color'].';' : '').' position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
$endTagA = false;
if ($show_links) {
@ -691,9 +694,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// SIMPLE DATA VALUE (type = 2)
// ****************************************************************
if ($resizedMap)
echo '<div style="z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion *$layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion *$layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion *$layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion *$layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<strong>'.$layout_data['label']. ' ';
echo get_db_value ('datos', 'tagente_estado', 'id_agente_modulo', $layout_data['id_agente_modulo']);
echo '</strong></div>';
@ -703,9 +706,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// Progress bar
// ****************************************************************
if ($resizedMap)
echo '<div style="text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion *$layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion *$layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion *$layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion *$layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
$valor = get_db_sql ('SELECT datos FROM tagente_estado WHERE id_agente_modulo = '.$layout_data['id_agente_modulo']);
$width = $layout_data['width'];
if ( $layout_data['height'] > 0)
@ -729,9 +732,9 @@ function print_pandora_visual_map ($id_layout, $show_links = true, $draw_lines =
// ****************************************************************
// SINGLE GRAPH (type = 1)
if ($resizedMap)
echo '<div style="text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.((integer)($proportion * $layout_data['pos_x'])).'px; margin-top:'.((integer)($proportion * $layout_data['pos_y'])).'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
else
echo '<div style="text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo '<div style="left: 0px; top: 0px; text-align: center; z-index: 1; color: '.$layout_data['label_color'].'; position: absolute; margin-left: '.$layout_data['pos_x'].'px; margin-top:'.$layout_data['pos_y'].'px;" id="layout-data-'.$layout_data['id'].'" class="layout-data">';
echo $layout_data['label'];
echo "<br>";