Merge branch 'ent-3138-ent-Cambiar-alert-por-dialog' into 'develop'

Cambiar alert por dialog

See merge request artica/pandorafms!2178

Former-commit-id: b8d1f9f1797ef1d3f54975ca8a695f0a5033938e

pandora_console/godmode/reporting/visual_console_builder.editor.js

@@ -231,6 +231,21 @@ function is_metaconsole() {
   else return false;
 }
 
+function dialog_message(message_id) {
+  $(message_id)
+    .css("display", "inline")
+    .dialog({
+      modal: true,
+      show: "blind",
+      hide: "blind",
+      buttons: {
+        Close: function() {
+          $(this).dialog("close");
+        }
+      }
+    });
+}
+
 function update_button_palette_callback() {
   var values = {};
 
@@ -240,14 +255,11 @@ function update_button_palette_callback() {
   switch (selectedItem) {
     case "background":
       if (values["width"] < 1024 || values["height"] < 768) {
-        alert("Min allowed size is 1024x768");
+        dialog_message("#message_min_allowed_size");
         return false;
       }
-
+      $("#hidden-background_width").val(values["width"]);
-      if (values["width"] == 0 && values["height"] == 0) {
+      $("#hidden-background_height").val(values["height"]);
-        values["width"] = $("#hidden-background_original_width").val();
-        values["height"] = $("#hidden-background_original_height").val();
-      }
       $("#background").css("width", values["width"]);
       $("#background").css("height", values["height"]);
 
@@ -259,11 +271,25 @@ function update_button_palette_callback() {
       break;
     case "box_item":
       if ($("input[name=width_box]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
+        return false;
+      }
+      if (
+        parseInt($("input[name='width_box']").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         return false;
       }
       if ($("input[name=height_box]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (
+        parseInt($("input[name='height_box']").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         return false;
       }
 
@@ -288,7 +314,7 @@ function update_button_palette_callback() {
         values["label"] == "" &&
         values["show_statistics"] == false
       ) {
-        alert("Undefined image");
+        dialog_message("#message_alert_no_image");
         return false;
       }
 
@@ -428,18 +454,32 @@ function update_button_palette_callback() {
       break;
     case "static_graph":
       if ($("input[name=width]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
+        return false;
+      }
+      if (
+        parseInt($("input[name='width']").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         return false;
       }
       if ($("input[name=height]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (
+        parseInt($("input[name='height']").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         return false;
       }
       if (
         (values["image"] == "" || values["image"] == "none") &&
         values["label"] == ""
       ) {
-        alert("Undefined image");
+        dialog_message("#message_alert_no_image");
         return false;
       }
 
@@ -555,13 +595,27 @@ function update_button_palette_callback() {
       break;
     case "percentile_bar":
     case "percentile_item":
-      if ($("input[name=width_percentile]").val() == "") {
+      if ($("input[name=height_percentile]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_height");
         return false;
       }
-
+      if ($("input[name=width_percentile]").val() == "") {
-      if ($("input[name=height_percentile]").val() == "") {
+        dialog_message("#message_alert_no_width");
-        alert("Undefined height");
+        return false;
+      }
+      if (
+        $("input[name=width_percentile]").val() >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
         return false;
       }
 
@@ -604,7 +658,6 @@ function update_button_palette_callback() {
           return false;
         }
       }
-
       if ($("#dir_items").html() == "vertical") {
         if (
           parseInt($("#text-top").val()) +
@@ -621,20 +674,41 @@ function update_button_palette_callback() {
           return false;
         }
       }
-
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
+        return false;
+      }
       if ($("input[name=width_module_graph]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
         return false;
       }
       if ($("input[name=height_module_graph]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (
+        parseInt(values["width_module_graph"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      if (
+        parseInt($("input[name=height_module_graph]").val()) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         return false;
       }
       if (
         $("#custom_graph_row").css("display") != "none" &&
         $("#custom_graph option:selected").html() == "None"
       ) {
-        alert("Undefined graph");
+        dialog_message("#message_alert_no_custom_graph");
         return false;
       }
 
@@ -644,12 +718,19 @@ function update_button_palette_callback() {
       break;
     case "bars_graph":
       if ($("input[name=width_percentile]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
         return false;
       }
-
       if ($("input[name=bars_graph_height]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent_string"] == "") {
+        dialog_message("#message_alert_no_agent");
         return false;
       }
 
@@ -660,18 +741,48 @@ function update_button_palette_callback() {
       break;
 
     case "clock":
+      if (
+        parseInt(values["width_percentile"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+
       $("#text_" + idItem).html(values["label"]);
       $("#image_" + idItem).attr("src", "images/spinner.gif");
       setClock(idItem, values);
       break;
 
     case "auto_sla_graph":
-      if ($("input[name=width]").val() == "") {
+      if (values["height"] == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_height");
         return false;
       }
-      if ($("input[name=height]").val() == "") {
+      if (
-        alert("Undefined height");
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        return false;
+      }
+      if (values["width"] == "") {
+        dialog_message("#message_alert_no_width");
+        return false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
         return false;
       }
       $("#text_" + idItem).html(values["label"]);
@@ -680,8 +791,22 @@ function update_button_palette_callback() {
       setEventsBar(idItem, values);
       break;
     case "donut_graph":
+      if (
+        parseInt(values["width_percentile"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module_string_type");
+        return false;
+      }
+      if (values["agent_string"] == "") {
+        dialog_message("#message_alert_no_agent");
+        return false;
+      }
       $("#image_" + idItem).attr("src", "images/spinner.gif");
-
       setDonutsGraph(idItem, values);
       break;
     case "simple_value":
@@ -718,21 +843,47 @@ function update_button_palette_callback() {
             "</span></td></tr><tr><td></td></tr></tbody></table>"
         );
       }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
+        return false;
+      }
       break;
     case "label":
+      if (values["label"] == "") {
+        dialog_message("#message_alert_no_label");
+        return false;
+      }
       $("#text_" + idItem).html(values["label"]);
       break;
     case "icon":
       if ($("input[name=width]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
+        return false;
+      }
+      if (
+        parseInt($("input[name=width]").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         return false;
       }
       if ($("input[name=height]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (
+        parseInt($("input[name=height]").val()) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         return false;
       }
       if (values["image"] == "" || values["image"] == "none") {
-        alert("Undefined image");
+        dialog_message("#message_alert_no_image");
         return false;
       }
       $("#image_" + idItem).attr("src", "images/spinner.gif");
@@ -779,13 +930,70 @@ function update_button_palette_callback() {
       var image = values["image"] + ".png";
       set_image("image", idItem, image);
       break;
+    case "line_item":
+      if (
+        parseInt(values["line_width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      break;
+    case "color_cloud":
+      if (
+        parseInt(values["diameter"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        return false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        return false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
+        return false;
+      }
+      break;
+    case "service":
+      if (values["height"] == "" || values["height_module_graph"] == 0) {
+        dialog_message("#message_alert_no_height");
+        return false;
+      }
+      if (
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        return false;
+      }
+      if (values["width"] == "" || values["width_module_graph"] == 0) {
+        dialog_message("#message_alert_no_width");
+        return false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        return false;
+      }
+      if (
+        $("select[name=service]").val() == "" ||
+        $("select[name=service]").val() == "none"
+      ) {
+        dialog_message("#message_alert_no_service");
+        return false;
+      }
+      break;
     default:
       if ($("input[name=width]").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
         return false;
       }
       if ($("input[name=height]").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
         return false;
       }
       //Maybe save in any Enterprise item.
@@ -1018,149 +1226,356 @@ function create_button_palette_callback() {
   switch (creationItem) {
     case "box_item":
       if ($("input[name='width_box']").val() == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt($("input[name='width_box']").val()) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         validate = false;
       }
       if ($("input[name='height_box']").val() == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt($("input[name='height_box']").val()) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         validate = false;
       }
       break;
     case "group_item":
+      if (values["height"] == "") {
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (values["width"] == "") {
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
       if (
         (values["image"] == "" || values["image"] == "none") &&
         values["label"] == "" &&
         values["show_statistics"] == false
       ) {
-        alert("Undefined images");
+        dialog_message("#message_alert_no_image");
         validate = false;
       }
       break;
     case "static_graph":
-      if (values["width"] == "") {
+      if (values["height"] == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_height");
         validate = false;
       }
-      if (values["height"] == "") {
+      if (
-        alert("Undefined height");
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (values["width"] == "") {
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         validate = false;
       }
       if (
         (values["image"] == "" || values["image"] == "none") &&
         values["label"] == false
       ) {
-        alert("Undefined image");
+        dialog_message("#message_alert_no_image");
         validate = false;
       }
 
       break;
     case "auto_sla_graph":
+      if (values["height"] == "") {
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (values["width"] == "") {
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        validate = false;
+      }
       if (values["agent"] == "") {
-        alert($("#message_alert_no_agent").html());
+        dialog_message("#message_alert_no_agent");
         validate = false;
       }
       break;
     case "donut_graph":
+      if (
+        parseInt(values["width_percentile"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module_string_type");
+        validate = false;
+      }
       if (values["agent_string"] == "") {
-        alert($("#message_alert_no_agent").html());
+        dialog_message("#message_alert_no_agent");
         validate = false;
       }
       break;
     case "label":
       if (values["label"] == "") {
-        alert($("#message_alert_no_label").html());
+        dialog_message("#message_alert_no_label");
         validate = false;
       }
       break;
     case "icon":
       if (values["width"] == "") {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
         validate = false;
       }
       if (values["height"] == "") {
-        alert("Undefined height");
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         validate = false;
       }
       if (values["image"] == "" || values["image"] == "none") {
-        alert($("#message_alert_no_image").html());
+        dialog_message("#message_alert_no_image");
         validate = false;
       }
       break;
     case "percentile_bar":
     case "percentile_item":
-      if (values["width"] == "") {
+      if (
-        alert("Undefined width");
+        parseInt(values["width_percentile"]) >
-        validate = false;
+        parseInt($("#hidden-background_width").val())
-      }
+      ) {
-      if (values["agent"] == "") {
+        dialog_message("#message_alert_max_width");
-        alert($("#message_alert_no_agent").html());
-        validate = false;
-      }
-      if (values["module"] == 0) {
-        alert($("#message_alert_no_module").html());
-        validate = false;
-      }
-      if (values["max_percentile"] == "") {
-        alert($("#message_alert_no_max_percentile").html());
         validate = false;
       }
       if (values["width_percentile"] == "") {
-        alert($("#message_alert_no_width_percentile").html());
+        dialog_message("#message_alert_no_width");
         validate = false;
       }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        validate = false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
+        validate = false;
+      }
+
+      if (values["max_percentile"] == "") {
+        dialog_message("#message_alert_no_max_percentile");
+        validate = false;
+      }
+
       break;
     case "module_graph":
-      if (values["width_module_graph"] == "") {
+      if (values["module"] == 0) {
-        alert("Undefined width");
+        dialog_message("#message_alert_no_module");
-        validate = false;
-      }
-      if (values["height_module_graph"] == "") {
-        alert("Undefined height");
         validate = false;
       }
       if (values["id_custom_graph"] == 0) {
         if (values["agent"] == "") {
-          alert($("#message_alert_no_agent").html());
+          dialog_message("#message_alert_no_agent");
-          validate = false;
-        }
-        if (values["module"] == 0) {
-          alert($("#message_alert_no_module").html());
           validate = false;
         }
         if (values["period"] == 0) {
-          alert($("#message_alert_no_period").html());
+          dialog_message("#message_alert_no_period");
           validate = false;
         }
       }
-      break;
+      if (
-    case "bars_graph":
+        values["height_module_graph"] == "" ||
-      if (values["agent_string"] == "") {
+        values["height_module_graph"] == 0
-        alert($("#message_alert_no_agent").html());
+      ) {
+        dialog_message("#message_alert_no_height");
         validate = false;
       }
-      if (values["module"] == 0) {
+      if (
-        alert($("#message_alert_no_module").html());
+        parseInt(values["height_module_graph"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (
+        values["width_module_graph"] == "" ||
+        values["width_module_graph"] == 0
+      ) {
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width_module_graph"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      break;
+    case "bars_graph":
+      if (values["bars_graph_height"] == "") {
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt(values["bars_graph_height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
         validate = false;
       }
       if (values["width_percentile"] == "") {
-        alert($("#message_alert_no_width_percentile").html());
+        dialog_message("#message_alert_no_width");
         validate = false;
       }
-      if (values["bars_graph_height"] == "") {
+      if (
-        alert($("#message_alert_no_bars_graph_height").html());
+        parseInt(values["width_percentile"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        validate = false;
+      }
+      if (values["agent_string"] == "") {
+        dialog_message("#message_alert_no_agent");
         validate = false;
       }
       break;
     case "simple_value":
-      if (values["agent"] == "") {
+      if (values["module"] == 0) {
-        alert($("#message_alert_no_agent").html());
+        dialog_message("#message_alert_no_module");
         validate = false;
       }
-      if (values["module"] == 0) {
+      if (values["agent"] == "") {
-        alert($("#message_alert_no_module").html());
+        dialog_message("#message_alert_no_agent");
         validate = false;
       }
       break;
+    case "clock":
+      if (
+        parseInt(values["width_percentile"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      break;
+    case "line_item":
+      if (
+        parseInt(values["line_width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      break;
+    case "color_cloud":
+      if (
+        parseInt(values["diameter"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (values["module"] == 0) {
+        dialog_message("#message_alert_no_module");
+        validate = false;
+      }
+      if (values["agent"] == "") {
+        dialog_message("#message_alert_no_agent");
+        validate = false;
+      }
+      break;
+    case "service":
+      if (values["height"] == "" || values["height_module_graph"] == 0) {
+        dialog_message("#message_alert_no_height");
+        validate = false;
+      }
+      if (
+        parseInt(values["height"]) >
+        parseInt($("#hidden-background_height").val())
+      ) {
+        dialog_message("#message_alert_max_height");
+        validate = false;
+      }
+      if (values["width"] == "" || values["width_module_graph"] == 0) {
+        dialog_message("#message_alert_no_width");
+        validate = false;
+      }
+      if (
+        parseInt(values["width"]) >
+        parseInt($("#hidden-background_width").val())
+      ) {
+        dialog_message("#message_alert_max_width");
+        validate = false;
+      }
+      if (
+        $("select[name=service]").val() == "" ||
+        $("select[name=service]").val() == "none"
+      ) {
+        dialog_message("#message_alert_no_service");
+        validate = false;
+      }
+      break;
+
     default:
       //Maybe save in any Enterprise item.
       if (typeof enterprise_create_button_palette_callback == "function") {
@@ -3714,17 +4129,7 @@ function createItem(type, values, id_data) {
             .attr("height", values["height"]);
         }
       }
-      // else{
+
-      // 	$('#image_'+id_data).css('width', values['width']+'px');
-      // 	$('#image_'+id_data).css('height', values['height']+'px');
-      // }
-      /*
-			var $span = $('<span></span>')
-				.attr('id', 'text_' + id_data)
-				.attr('class', 'text')
-				.append(values['label']);
-			
-*/
       var $input = $("<input></input>")
         .attr("id", "hidden-status_" + id_data)
         .attr("type", "hidden")
@@ -4489,7 +4894,6 @@ function createItem(type, values, id_data) {
     case "clock":
       sizeStyle = "";
       imageSize = "";
-
       if (values["label_position"] == "up") {
         item = $(
           '<div id="' +

pandora_console/include/functions_visual_map_editor.php

@@ -1313,20 +1313,79 @@ function visual_map_editor_print_hack_translate_strings()
     echo '<span id="any_text" style="display: none;">'.__('Any').'</span>';
     echo '<span id="ip_text" style="display: none;">'.__('IP').'</span>';
 
-    // Hack to translate messages in javascript
+    // Hack to translate messages in javascript.
-    echo '<span style="display: none" id="message_alert_no_label_no_image">'.__('No image or name defined.').'</span>';
+    echo "<div id='message_min_allowed_size'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
-    echo '<span style="display: none" id="message_alert_no_label">'.__('No label defined.').'</span>';
+    echo "<p style='text-align: center;font-weight: bold;'>".__('Min allowed size is 1024x768.').'</p>';
-    echo '<span style="display: none" id="message_alert_no_image">'.__('No image defined.').'</span>';
+    echo '</div>';
-    echo '<span style="display: none" id="message_alert_no_process">'.__('No process defined.').'</span>';
+
-    echo '<span style="display: none" id="message_alert_no_max_percentile">'.__('No Max value defined.').'</span>';
+    echo "<div id='message_alert_no_custom_graph'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
-    echo '<span style="display: none" id="message_alert_no_width_percentile">'.__('No width defined.').'</span>';
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No custom graph defined.').'</p>';
-    echo '<span style="display: none" id="message_alert_no_bars_graph_height">'.__('No height defined.').'</span>';
+    echo '</div>';
-    echo '<span style="display: none" id="message_alert_no_period">'.__('No period defined.').'</span>';
+
-    echo '<span style="display: none" id="message_alert_no_agent">'.__('No agent defined.').'</span>';
+    echo "<div id='message_alert_no_label_no_image'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
-    echo '<span style="display: none" id="message_alert_no_module">'.__('No module defined.').'</span>';
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No image or name defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_label'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No label defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_service'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No service defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_image'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No image defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_process'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No process defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_max_percentile'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No Max value defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_width'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No width defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_height'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No height defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_max_width'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('The width must not exceed the size of the visual console container.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_max_height'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('The height must not exceed the size of the visual console container.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_period'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No period defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_agent'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No agent defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_module'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No module defined.').'</p>';
+    echo '</div>';
+
+    echo "<div id='message_alert_no_module_string_type'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('No module defined. This module must be string type.').'</p>';
+    echo '</div>';
+
+    echo "<div id='hack_translation_correct_save'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('Successfully save the changes.').'</p>';
+    echo '</div>';
+
+    echo "<div id='hack_translation_incorrect_save'  title='".__('Visual Console Builder Information')."' style='display:none;'>";
+    echo "<p style='text-align: center;font-weight: bold;'>".__('Could not be save.').'</p>';
+    echo '</div>';
 
-    echo '<span style="display: none" id="hack_translation_correct_save">'.__('Successfully save the changes.').'</span>';
-    echo '<span style="display: none" id="hack_translation_incorrect_save">'.__('Could not be save').'</span>';
 }