Merge branch '1416-cambios-visuales-en-la-grafica-de-barras-en-consola-visual-dev' into 'develop'

Added height to bars graph

See merge request artica/pandorafms!1059

pandora_console/godmode/reporting/visual_console_builder.editor.js

@@ -616,6 +616,11 @@ function update_button_palette_callback() {
 				return false;
 			}
 
+			if($('input[name=bars_graph_height]').val() == ''){
+				alert('Undefined height');
+				return false;
+			}
+		
 			$("#text_" + idItem).html(values['label']);
 			$("#image_" + idItem).attr("src", "images/spinner.gif");
 			
@@ -818,6 +823,7 @@ function readFields() {
 	values['parent'] = $("select[name=parent]").val();
 	values['map_linked'] = $("select[name=map_linked]").val();
 	values['width_percentile'] = $("input[name=width_percentile]").val();
+	values['bars_graph_height'] = $("input[name=bars_graph_height]").val();
 	values['max_percentile'] = parseInt($("input[name=max_percentile]").val());
 	values['width_module_graph'] = $("input[name=width_module_graph]").val();
 	values['height_module_graph'] = $("input[name=height_module_graph]").val();
@@ -993,6 +999,14 @@ function create_button_palette_callback() {
 				alert($("#message_alert_no_module").html());
 				validate = false;
 			}
+			if ((values['width_percentile'] == '')) {
+				alert($("#message_alert_no_width_percentile").html());
+				validate = false;
+			}
+			if ((values['bars_graph_height'] == '')) {
+				alert($("#message_alert_no_bars_graph_height").html());
+				validate = false;
+			}
 			break;
 		case 'simple_value':
 			if ((values['agent'] == '')) {
@@ -1498,6 +1512,8 @@ function loadFieldsFromDB(item) {
 					$("select[name=map_linked]").val(val);
 				if (key == 'width_percentile')
 					$("input[name=width_percentile]").val(val);
+				if (key == 'bars_graph_height')
+					$("input[name=bars_graph_height]").val(val);
 				if (key == 'max_percentile')
 					$("input[name=max_percentile]").val(val);
 				if (key == 'width_module_graph')
@@ -1751,6 +1767,9 @@ function hiddenFields(item) {
 	$("#percentile_bar_row_1").css('display', 'none');
 	$("#percentile_bar_row_1." + item).css('display', '');
 
+	$("#height_bars_graph_row").css('display', 'none');
+	$("#height_bars_graph_row." + item).css('display', '');
+
 	$("#percentile_bar_row_2").css('display', 'none');
 	$("#percentile_bar_row_2." + item).css('display', '');
 
@@ -1853,6 +1872,7 @@ function cleanFields(item) {
 	$("select[name=process_value]").val(0);
 	$("select[name=background_image]").val('');
 	$("input[name=width_percentile]").val('');
+	$("input[name=bars_graph_height]").val('');
 	$("input[name=max_percentile]").val('');
 	$("select[name=period]").val('');
 	$("input[name=width]").val(0);
@@ -2024,6 +2044,7 @@ function setBarsGraph(id_data, values) {
 	}
 
 	width_percentile = values['width_percentile'];
+	bars_graph_height = values['bars_graph_height'];
 
 	parameter = Array();
 	
@@ -2041,12 +2062,12 @@ function setBarsGraph(id_data, values) {
 		success: function (data) {
 			$("#" + id_data + " img").attr('src', url_hack_metaconsole + 'images/console/signes/barras.png');
 			
-			if (values['width_percentile'] == "0") {
+			if (values['width_percentile'] == "0" && values["bars_graph_height"] == "0") {
 				// Image size
 			}
 			else{
-				$("#" + id_data + " img").css('width', width_percentile+'px');
+				$("#" + id_data + " img").css('width', width_percentile + 'px');
-				$("#" + id_data + " img").css('height', width_percentile+'px');
+				$("#" + id_data + " img").css('height', bars_graph_height + 'px');
 			}
 			
 			if($('#'+id_data+' table').css('float') == 'right' || $('#'+id_data+ ' table').css('float') == 'left'){

pandora_console/include/ajax/visual_console_builder.ajax.php

@@ -101,6 +101,7 @@ $height = get_parameter('height', null);
 $parent = get_parameter('parent', null);
 $map_linked = get_parameter('map_linked', null);
 $width_percentile = get_parameter('width_percentile', null);
+$bars_graph_height = get_parameter('bars_graph_height', null);
 $max_percentile = get_parameter('max_percentile', null);
 $height_module_graph = get_parameter('height_module_graph', null);
 $width_module_graph = get_parameter('width_module_graph', null);
@@ -655,6 +656,9 @@ switch ($action) {
 						if ($width_percentile !== null) {
 							$values['width'] = $width_percentile;
 						}
+						if ($bars_graph_height !== null) {
+							$values['height'] = $bars_graph_height;
+						}
 						if ($bars_graph_type !== null) {
 							$values['type_graph'] = $bars_graph_type;
 						}
@@ -749,6 +753,7 @@ switch ($action) {
 							unset($values['border_color']);
 							unset($values['width']);
 							unset($values['id_agent']);
+							unset($values['height']);
 							break;
 						case 'donut_graph':
 							unset($values['border_color']);
@@ -920,6 +925,7 @@ switch ($action) {
 						break;
 					case 'bars_graph':
 						$elementFields['width_percentile'] = $elementFields['width'];
+						$elementFields['bars_graph_height'] = $elementFields['height'];
 						$elementFields['bars_graph_type'] = $elementFields['type_graph'];
 						$elementFields['grid_color'] = $elementFields['border_color'];
 						$elementFields['id_agent_string'] = $elementFields['id_agent'];
@@ -1082,12 +1088,8 @@ switch ($action) {
 				break;
 			case 'bars_graph':
 				$values['type'] = BARS_GRAPH;
-				if ($width_percentile == null) {
+				$values['width'] = $width_percentile;
-					$values['width'] = 0;
+				$values['height'] = $bars_graph_height;
-				}
-				else {
-					$values['width'] = $width_percentile;
-				}
 				$values['type_graph'] = $bars_graph_type;
 				$values['image'] = $background_color;
 				$values['border_color'] = $grid_color;

pandora_console/include/functions_visual_map.php

@@ -1149,10 +1149,10 @@ function visual_map_print_item($mode = "read", $layoutData,
 				}
 				else{
 					if ($layoutData['id_metaconsole'] != 0) {
-						$img =  '<img src="../../images/console/signes/barras.png" style="width:'.$width.'px;height:'.$width.'px;'.$imgpos.'">';
+						$img =  '<img src="../../images/console/signes/barras.png" style="width:'.$width.'px;height:'.$height.'px;'.$imgpos.'">';
 					}
 					else{
-						$img =  '<img src="images/console/signes/barras.png" style="width:'.$width.'px;height:'.$width.'px;'.$imgpos.'">';
+						$img =  '<img src="images/console/signes/barras.png" style="width:'.$width.'px;height:'.$height.'px;'.$imgpos.'">';
 					}
 				}
 			}
@@ -1209,7 +1209,7 @@ function visual_map_print_item($mode = "read", $layoutData,
 				$water_mark = array('file' => '/var/www/html/pandora_console/images/logo_vertical_water.png', 
 									'url' => 'http://localhost/pandora_console/images/logo_vertical_water.png');
 				
-				if ($width == 0) {
+				if ($width == 0 && $height == 0) {
 					if ($layoutData['label_position']=='left') {
 						if ($layoutData['type_graph'] == 'horizontal') {
 							$img = '<div style="float:right;height:'.$himg.'px;">'.
@@ -1268,7 +1268,7 @@ function visual_map_print_item($mode = "read", $layoutData,
 						if ($layoutData['type_graph'] == 'horizontal') {
 							$img = '<div style="float:right;height:'.$himg.'px;">'.
 								hbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], $layoutData['border_color']) . '</div>';
@@ -1276,7 +1276,7 @@ function visual_map_print_item($mode = "read", $layoutData,
 						else {
 							$img = '<div style="float:right;height:'.$himg.'px;">'. 
 								vbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], true, false, $layoutData['border_color']) . '</div>';
@@ -1286,7 +1286,7 @@ function visual_map_print_item($mode = "read", $layoutData,
 						if ($layoutData['type_graph'] == 'horizontal') {
 							$img = '<div style="float:left;height:'.$himg.'px;">'.
 								hbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], $layoutData['border_color']) . '</div>';
@@ -1294,7 +1294,7 @@ function visual_map_print_item($mode = "read", $layoutData,
 						else {
 							$img = '<div style="float:left;height:'.$himg.'px;">'. 
 								vbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], true, false, $layoutData['border_color']) . '</div>';
@@ -1303,14 +1303,14 @@ function visual_map_print_item($mode = "read", $layoutData,
 					else {
 						if ($layoutData['type_graph'] == 'horizontal') {
 							$img = hbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], $layoutData['border_color']);
 						}
 						else {
 							$img = vbar_graph(true, $module_data,
-								$width, $width, $color, array(), array(),
+								$width, $height, $color, array(), array(),
 								ui_get_full_url("images/image_problem.opaque.png", false, false, false),
 								"", "", $water_mark, $config['fontpath'], 6,
 								"", 0, $config['homeurl'], $layoutData['image'], true, false, $layoutData['border_color']);

pandora_console/include/functions_visual_map_editor.php

@@ -460,6 +460,11 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background) {
 				__('Width') . '</td>
 				<td align="left">' . html_print_input_text('width_percentile', 0, '', 3, 5, true) . '</td>';
 
+			$form_items['height_bars_graph_row'] = array();
+			$form_items['height_bars_graph_row']['items'] = array('bars_graph');
+			$form_items['height_bars_graph_row']['html'] = '<td align="left">' .
+				__('Height') . '</td>
+				<td align="left">' . html_print_input_text('bars_graph_height', 0, '', 3, 5, true) . '</td>';
 			
 			$form_items['percentile_bar_row_2'] = array();
 			$form_items['percentile_bar_row_2']['items'] = array('percentile_bar', 'percentile_item', 'datos');
@@ -827,6 +832,8 @@ function visual_map_editor_print_hack_translate_strings() {
 		__('No Max value defined.') .'</span>';
 	echo '<span style="display: none" id="message_alert_no_width_percentile">' .
 		__('No width defined.') .'</span>';
+	echo '<span style="display: none" id="message_alert_no_bars_graph_height">' .
+		__('No height defined.') .'</span>';
 	echo '<span style="display: none" id="message_alert_no_period">' .
 		__('No period defined.') .'</span>';
 	echo '<span style="display: none" id="message_alert_no_agent">' .