';
+margin: 0px auto;border: 1px lightgray solid; width: '.$widthBackground.'px; height: '.$heightBackground.'px;background-color: '.$visualConsole['background_color'].';z-index:0;">';
echo "
';
+
// ----------------------------------------------------------------------
// BEHAVIOUR CONFIGURATION
// ----------------------------------------------------------------------
@@ -2243,9 +2247,22 @@ $(document).ready (function () {
// Show the cache expiration conf or not.
$("input[name=legacy_vc]").change(function (e) {
if ($(this).prop("checked") === true) {
- $("select#vc_default_cache_expiration_select").closest("tr").hide();
+ $("select#vc_default_cache_expiration_select").closest("td").hide();
+ $("#dialog-legacy-vc").dialog({
+ modal: true,
+ width: 500,
+ buttons:[
+ {
+ class: 'ui-widget ui-state-default ui-corner-all ui-button-text-only sub upd submit-next',
+ text: "",
+ click: function(){
+ $(this).dialog("close");
+ }
+ }
+ ]
+ });
} else {
- $("select#vc_default_cache_expiration_select").closest("tr").show();
+ $("select#vc_default_cache_expiration_select").closest("td").show();
}
}).change();
diff --git a/pandora_console/include/ajax/visual_console_builder.ajax.php b/pandora_console/include/ajax/visual_console_builder.ajax.php
index 5736815d6c..d4f8259ac8 100755
--- a/pandora_console/include/ajax/visual_console_builder.ajax.php
+++ b/pandora_console/include/ajax/visual_console_builder.ajax.php
@@ -34,7 +34,7 @@ if ($get_image_path_status) {
$id_visual_console = get_parameter('id_visual_console', null);
// WARNING: CHECK THE ENTIRE FUNCTIONALITY
-// Visual console id required
+// Visual console id required.
if (empty($id_visual_console)) {
db_pandora_audit(
AUDIT_LOG_ACL_VIOLATION,
@@ -1774,7 +1774,7 @@ switch ($action) {
break;
}
-// visual map element status check
+// Visual map element status check.
if ($get_element_status) {
$layoutData = db_get_row_filter(
'tlayout_data',
diff --git a/pandora_console/include/functions_visual_map.php b/pandora_console/include/functions_visual_map.php
index 97ac7263fd..7f60dd24dd 100755
--- a/pandora_console/include/functions_visual_map.php
+++ b/pandora_console/include/functions_visual_map.php
@@ -3572,12 +3572,13 @@ function visual_map_print_visual_map(
}
echo '
';
+ style="margin:0px auto;text-align:
+ z-index: 0;
+ position:relative;
+ width:'.$mapWidth.'px;
+ height:'.$mapHeight.'px;
+ background-color:'.$layout['background_color'].';
+ z-index:0;">';
if ($layout['background'] != 'None.png') {
echo "
.")
";
diff --git a/pandora_console/include/functions_visual_map_editor.php b/pandora_console/include/functions_visual_map_editor.php
index 6c1820a87c..c40d2e0740 100755
--- a/pandora_console/include/functions_visual_map_editor.php
+++ b/pandora_console/include/functions_visual_map_editor.php
@@ -130,18 +130,16 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'datos',
'box_item',
];
- $form_items['border_color_row']['html'] = '
'.__('Border color').' | '.'
'.html_print_input_text_extended(
+ $form_items['border_color_row']['html'] = ' | '.__('Border color').' | ';
+ $form_items['border_color_row']['html'] .= '
';
+ $form_items['border_color_row']['html'] .= html_print_input_color(
'border_color',
'#000000',
'text-border_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="border_color"',
true
- ).' | ';
+ );
+ $form_items['border_color_row']['html'] .= '';
$form_items['border_width_row'] = [];
$form_items['border_width_row']['items'] = [
@@ -157,18 +155,16 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'box_item',
'clock',
];
- $form_items['fill_color_row']['html'] = '
'.__('Fill color').' | '.'
'.html_print_input_text_extended(
+ $form_items['fill_color_row']['html'] = ' | '.__('Fill color').' | ';
+ $form_items['fill_color_row']['html'] .= '
';
+ $form_items['fill_color_row']['html'] .= html_print_input_color(
'fill_color',
'#000000',
'text-fill_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="fill_color"',
true
- ).' | ';
+ );
+ $form_items['fill_color_row']['html'] .= '';
$form_items['module_graph_size_row'] = [];
$form_items['module_graph_size_row']['items'] = [
@@ -375,18 +371,16 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
$form_items['grid_color_row'] = [];
$form_items['grid_color_row']['items'] = ['bars_graph'];
- $form_items['grid_color_row']['html'] = '
'.__('Grid color').' | '.'
'.html_print_input_text_extended(
+ $form_items['grid_color_row']['html'] = ' | '.__('Grid color').' | ';
+ $form_items['grid_color_row']['html'] .= '
';
+ $form_items['grid_color_row']['html'] .= html_print_input_color(
'grid_color',
'#000000',
'text-grid_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="grid_color"',
true
- ).' | ';
+ );
+ $form_items['grid_color_row']['html'] .= '';
$form_items['radio_choice_graph'] = [];
$form_items['radio_choice_graph']['items'] = [
@@ -500,18 +494,18 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
$form_items['resume_color_row'] = [];
$form_items['resume_color_row']['items'] = ['donut_graph'];
- $form_items['resume_color_row']['html'] = '
'.__('Resume data color').' | '.'
'.html_print_input_text_extended(
+ $form_items['resume_color_row']['html'] = ' | ';
+ $form_items['resume_color_row']['html'] .= __('Resume data color');
+ $form_items['resume_color_row']['html'] .= ' | ';
+ $form_items['resume_color_row']['html'] .= '
';
+ $form_items['resume_color_row']['html'] .= html_print_input_color(
'resume_color',
'#000000',
'text-resume_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="resume_color"',
true
- ).' | ';
+ );
+ $form_items['resume_color_row']['html'] .= '';
$event_times = [
86400 => __('24h'),
@@ -637,24 +631,60 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'background',
'datos',
];
- $form_items['background_row_2']['html'] = '
'.__('Original Size').' |
-
'.html_print_button(__('Apply'), 'original_false', false, "setAspectRatioBackground('original')", 'class="sub vs_button_ghost"', true).' | ';
+ $form_items['background_row_2']['html'] = '
'.__('Original Size').' | ';
+ $form_items['background_row_2']['html'] .= '
';
+ $form_items['background_row_2']['html'] .= html_print_button(
+ __('Apply'),
+ 'original_false',
+ false,
+ 'setAspectRatioBackground("original", '.$visualConsole_id.')',
+ [
+ 'icon' => 'cog',
+ 'mode' => 'mini secondary',
+ ],
+ true
+ );
+ $form_items['background_row_2']['html'] .= ' | ';
$form_items['background_row_3'] = [];
$form_items['background_row_3']['items'] = [
'background',
'datos',
];
- $form_items['background_row_3']['html'] = '
'.__('Aspect ratio').' |
-
'.html_print_button(__('Proportional Width'), 'original_false', false, "setAspectRatioBackground('width')", 'class="sub vs_button_ghost"', true).' | ';
+ $form_items['background_row_3']['html'] = '
'.__('Aspect ratio').' | ';
+ $form_items['background_row_3']['html'] .= '
';
+ $form_items['background_row_3']['html'] .= html_print_button(
+ __('Proportional Width'),
+ 'original_false',
+ false,
+ 'setAspectRatioBackground("width", '.$visualConsole_id.')',
+ [
+ 'icon' => 'cog',
+ 'mode' => 'mini secondary',
+ ],
+ true
+ );
+ $form_items['background_row_3']['html'] .= ' | ';
$form_items['background_row_4'] = [];
$form_items['background_row_4']['items'] = [
'background',
'datos',
];
- $form_items['background_row_4']['html'] = '
|
-
'.html_print_button(__('Height proportional'), 'original_false', false, "setAspectRatioBackground('height')", 'class="sub vs_button_ghost"', true).' | ';
+ $form_items['background_row_4']['html'] = '
| ';
+ $form_items['background_row_4']['html'] .= '
';
+ $form_items['background_row_4']['html'] .= html_print_button(
+ __('Height proportional'),
+ 'original_false',
+ false,
+ 'setAspectRatioBackground("height", '.$visualConsole_id.')',
+ [
+ 'icon' => 'cog',
+ 'mode' => 'mini secondary',
+ ],
+ true
+ );
+ $form_items['background_row_4']['html'] .= ' | ';
$form_items['percentile_bar_row_1'] = [];
$form_items['percentile_bar_row_1']['items'] = [
@@ -665,11 +695,31 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'bars_graph',
'clock',
];
- $form_items['percentile_bar_row_1']['html'] = '
'.__('Widtzzzzh').html_print_input_text('width_percentile', 0, '', 3, 5, true).' | ';
+ $form_items['percentile_bar_row_1']['html'] = '
'.__('Width').' | ';
+ $form_items['percentile_bar_row_1']['html'] .= '
';
+ $form_items['percentile_bar_row_1']['html'] .= html_print_input_text(
+ 'width_percentile',
+ 0,
+ '',
+ 3,
+ 5,
+ true
+ );
+ $form_items['percentile_bar_row_1']['html'] .= ' | ';
$form_items['height_bars_graph_row'] = [];
$form_items['height_bars_graph_row']['items'] = ['bars_graph'];
- $form_items['height_bars_graph_row']['html'] = '
'.__('Height').html_print_input_text('bars_graph_height', 0, '', 3, 5, true).' | ';
+ $form_items['height_bars_graph_row']['html'] = '
'.__('Height').' | ';
+ $form_items['height_bars_graph_row']['html'] .= '
';
+ $form_items['height_bars_graph_row']['html'] .= html_print_input_text(
+ 'bars_graph_height',
+ 0,
+ '',
+ 3,
+ 5,
+ true
+ );
+ $form_items['height_bars_graph_row']['html'] .= ' | ';
$form_items['percentile_bar_row_2'] = [];
$form_items['percentile_bar_row_2']['items'] = [
@@ -735,16 +785,11 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'datos',
];
$form_items['percentile_item_row_5']['html'] = '
'.__('Element color').' |
-
'.html_print_input_text_extended(
+ | '.html_print_input_color(
'percentile_color',
'#ffffff',
'text-percentile_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="percentile_color"',
true
).' | ';
@@ -755,16 +800,11 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'datos',
];
$form_items['percentile_item_row_6']['html'] = '
'.__('Value color').' |
-
'.html_print_input_text_extended(
+ | '.html_print_input_color(
'percentile_label_color',
'#ffffff',
'text-percentile_label_color',
'',
- 7,
- 7,
- false,
- '',
- 'class="percentile_label_color"',
true
).' | ';
@@ -815,8 +855,16 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
// End of Color Cloud rows
$form_items['show_on_top_row'] = [];
$form_items['show_on_top_row']['items'] = ['group_item'];
- $form_items['show_on_top_row']['html'] = '
'.__('Always show on top').' |
-
'.html_print_checkbox('show_on_top', 1, '', true).ui_print_help_tip(__('It allows the element to be superimposed to the rest of items of the visual console'), true).' | ';
+ $form_items['show_on_top_row']['html'] = '
';
+ $form_items['show_on_top_row']['html'] .= __('Always show on top');
+ $form_items['show_on_top_row']['html'] .= ui_print_help_tip(
+ __('It allows the element to be superimposed to the rest of items of the visual console'),
+ true
+ );
+ $form_items['show_on_top_row']['html'] .= ' | ';
+ $form_items['show_on_top_row']['html'] .= '
';
+ $form_items['show_on_top_row']['html'] .= html_print_checkbox('show_on_top', 1, '', true);
+ $form_items['show_on_top_row']['html'] .= ' | ';
$show_last_value = [
'0' => __('Hide last value on boolean modules'),
@@ -875,11 +923,11 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
$form_items['button_update_row'] = [];
$form_items['button_update_row']['items'] = ['datos'];
- $form_items['button_update_row']['html'] = '
'.html_print_button(__('Cancel'), 'cancel_button', false, 'cancel_button_palette_callback();', 'class="sub cancel"', true).' '.html_print_button(__('Update'), 'update_button', false, 'update_button_palette_callback();', 'class="sub upd"', true).' | ';
+ $form_items['button_update_row']['html'] = '
'.html_print_button(__('Cancel'), 'cancel_button', false, 'cancel_button_palette_callback();', [ 'icon' => 'delete', 'mode' => 'secondary'], true).' '.html_print_button(__('Update'), 'update_button', false, 'update_button_palette_callback();', [ 'icon' => 'upd'], true).' | ';
$form_items['button_create_row'] = [];
$form_items['button_create_row']['items'] = ['datos'];
- $form_items['button_create_row']['html'] = '
'.html_print_button(__('Cancel'), 'cancel_button', false, 'cancel_button_palette_callback();', 'class="sub cancel"', true).' '.html_print_button(__('Create'), 'create_button', false, 'create_button_palette_callback();', 'class="sub wand"', true).' | ';
+ $form_items['button_create_row']['html'] = '
'.html_print_button(__('Cancel'), 'cancel_button', false, 'cancel_button_palette_callback();', [ 'icon' => 'delete', 'mode' => 'secondary'], true).' '.html_print_button(__('Create'), 'create_button', false, 'create_button_palette_callback();', [ 'icon' => 'wand'], true).' | ';
foreach ($form_items as $item => $item_options) {
echo '
';
@@ -1054,14 +1102,18 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'.__('Restrict access to group').''.''.html_print_select_groups(
+ $form_items_advance['element_group_row']['html'] = ' | ';
+ $form_items_advance['element_group_row']['html'] .= __('Restrict access to group');
+ $form_items_advance['element_group_row']['html'] .= ui_print_help_tip(
+ __('If selected, restrict visualization of this item in the visual console to users who have access to selected group. This is also used on calculating child visual consoles.'),
+ true
+ );
+ $form_items_advance['element_group_row']['html'] .= ' | ';
+ $form_items_advance['element_group_row']['html'] .= '';
+ $form_items_advance['element_group_row']['html'] .= html_print_select_groups(
$config['id_user'],
'VR',
true,
@@ -1211,10 +1271,8 @@ function visual_map_editor_print_item_palette($visualConsole_id, $background)
'',
'',
true
- ).ui_print_help_tip(
- __('If selected, restrict visualization of this item in the visual console to users who have access to selected group. This is also used on calculating child visual consoles.'),
- true
- ).' | ';
+ );
+ $form_items_advance['element_group_row']['html'] .= '';
if (!$config['legacy_vc']) {
$intervals = [
@@ -1393,8 +1451,8 @@ function visual_map_editor_print_toolbox()
visual_map_print_button_editor('icon', __('Icon'), 'left', false, 'icon_min', true);
visual_map_print_button_editor('clock', __('Clock'), 'left', false, 'clock_min', true);
visual_map_print_button_editor('group_item', __('Group'), 'left', false, 'group_item_min', true);
- visual_map_print_button_editor('box_item', __('Box'), 'left', false, 'box_item_min', true);
- visual_map_print_button_editor('line_item', __('Line'), 'left', false, 'line_item_min', true);
+ visual_map_print_button_editor('box_item', __('Box'), 'left', false, 'box_item', true);
+ visual_map_print_button_editor('line_item', __('Line'), 'left', false, 'line_item', true);
visual_map_print_button_editor('color_cloud', __('Color cloud'), 'left', false, 'color_cloud_min', true);
if (isset($config['legacy_vc']) === false
|| (bool) $config['legacy_vc'] === false
@@ -1415,9 +1473,9 @@ function visual_map_editor_print_toolbox()
$text_autosave = html_print_input_hidden('auto_save', true, true);
visual_map_print_item_toolbox('auto_save', $text_autosave, 'right');
- visual_map_print_button_editor('show_grid', __('Show grid'), 'right', true, 'grid_min', true);
- visual_map_print_button_editor('edit_item', __('Update item'), 'right', true, 'config_min', true);
- visual_map_print_button_editor('delete_item', __('Delete item'), 'right', true, 'delete_min', true);
+ visual_map_print_button_editor('show_grid', __('Show grid'), 'right', true, 'show_grid', true);
+ visual_map_print_button_editor('edit_item', __('Update item'), 'right', true, 'edit_item', true);
+ visual_map_print_button_editor('delete_item', __('Delete item'), 'right', true, 'delete_item', true);
visual_map_print_button_editor('copy_item', __('Copy item'), 'right', true, 'copy_item', true);
echo '';
echo '';
@@ -1435,12 +1493,12 @@ function visual_map_print_button_editor(
) {
html_print_button(
$label,
- 'button_toolbox2',
+ $idDiv,
$disabled,
- "click_button_toolbox('".$idDiv."');",
+ 'click_button_toolbox("'.$idDiv.'");',
[
- 'icon' => $class,
- 'mode' => 'onlyIcon',
+ 'class' => $class.' float-'.$float,
+ 'mode' => 'onlyIcon',
],
false,
$imageButton
diff --git a/pandora_console/include/styles/pandora.css b/pandora_console/include/styles/pandora.css
index bdd0d3f395..ef19fbdb13 100644
--- a/pandora_console/include/styles/pandora.css
+++ b/pandora_console/include/styles/pandora.css
@@ -4429,9 +4429,13 @@ span.log_zone_line_error {
border: 1px solid red;
}
-#toolbox > input {
- border-width: 0px 1px 0px 0px;
- border-color: lightgray;
+/* VISUAL MAP */
+#toolbox {
+ padding-top: 10px;
+}
+
+#toolbox button {
+ margin: 0px 10px;
}
#toolbox > input.service_min {
@@ -10448,12 +10452,24 @@ button.submitButton.onlyIcon.delete_item {
-webkit-mask: url(../../images/delete.svg) no-repeat right / contain;
}
+button.buttonButton.onlyIcon.edit_item,
+button.submitButton.onlyIcon.edit_item {
+ mask: url(../../images/edit.svg) no-repeat right / contain;
+ -webkit-mask: url(../../images/edit.svg) no-repeat right / contain;
+}
+
button.buttonButton.onlyIcon.copy_item,
button.submitButton.onlyIcon.copy_item {
mask: url(../../images/copy.svg) no-repeat right / contain;
-webkit-mask: url(../../images/copy.svg) no-repeat right / contain;
}
+button.buttonButton.onlyIcon.show_grid,
+button.submitButton.onlyIcon.show_grid {
+ mask: url(../../images/WMI@svg.svg) no-repeat right / contain;
+ -webkit-mask: url(../../images/WMI@svg.svg) no-repeat right / contain;
+}
+
button.buttonButton.link-create-item,
button.submitButton.link-create-item {
border-radius: 0;
diff --git a/pandora_console/include/styles/visual_maps.css b/pandora_console/include/styles/visual_maps.css
index f106dda76d..7bb126fcb7 100644
--- a/pandora_console/include/styles/visual_maps.css
+++ b/pandora_console/include/styles/visual_maps.css
@@ -99,15 +99,6 @@ div#vc-controls img.vc-qr {
flex: inherit;
}
-input.vs_button_ghost {
- background-color: transparent;
- border: 1px solid #82b92e;
- color: #82b92e;
- text-align: center;
- padding: 4px 12px;
- font-weight: bold;
-}
-
#toolbox #auto_save {
padding-top: 5px;
}
diff --git a/pandora_console/operation/visual_console/legacy_view.php b/pandora_console/operation/visual_console/legacy_view.php
index e1122e181d..57cce1a06d 100644
--- a/pandora_console/operation/visual_console/legacy_view.php
+++ b/pandora_console/operation/visual_console/legacy_view.php
@@ -192,30 +192,41 @@ $options['view']['text'] = ''.html_print_image(
- 'images/full_screen.png',
- true,
- [
- 'title' => __('Full screen mode'),
- 'class' => 'invert_filter',
- ]
- ).'';
- ui_print_page_header(
- $layout_name,
- 'images/visual_console.png',
- false,
- 'visual_console_view',
- false,
- $options
- );
- }
+if (!$config['pure']) {
+ $options['pure']['text'] = ''.html_print_image(
+ 'images/full_screen.png',
+ true,
+ [
+ 'title' => __('Full screen mode'),
+ 'class' => 'invert_filter',
+ ]
+ ).'';
- // Set the hidden value for the javascript
+ ui_print_standard_header(
+ $layout_name,
+ 'images/visual_console.png',
+ false,
+ 'visual_console_view',
+ false,
+ $options,
+ [
+ [
+ 'link' => '',
+ 'label' => __('Topology maps'),
+ ],
+ [
+ 'link' => '',
+ 'label' => __('Visual console'),
+ ],
+ ]
+ );
+}
+
+if (!is_metaconsole()) {
+ // Set the hidden value for the javascript.
html_print_input_hidden('metaconsole', 0);
} else {
- // Set the hidden value for the javascript
+ // Set the hidden value for the javascript.
html_print_input_hidden('metaconsole', 1);
}