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

Merge branch 'visual-console-refactor' into 'develop' 

Visual console refactor: hotfixes

See merge request artica/pandorafms!2384

Former-commit-id: 59e435071a8cf94f4628ce04a77c00b42c65e4eb
This commit is contained in:
Daniel Rodriguez 2019-04-29 12:43:42 +02:00
parent 5d6bd31786 a5379be0d9
commit 9788a9f6d5
15 changed files with 102 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pandora_console/include/functions_config.php
View File

@ -2420,7 +2420,7 @@ function config_process_config()
}
if (!isset($config['legacy_vc'])) {
config_update_value('legacy_vc', 0);
config_update_value('legacy_vc', 1);
}
if (!isset($config['vc_refr'])) {

2
pandora_console/include/javascript/pandora_visual_console.js
View File

@ -98,7 +98,7 @@ function createVisualConsole(
e.data.linkedLayoutId > 0 &&
e.data.link != null &&
e.data.link.length > 0 &&
(e.data.metaconsoleId == null || e.data.metaconsoleId === 0)
(e.data.linkedLayoutAgentId == null || e.data.linkedLayoutAgentId === 0)
) {
// Stop the current link behavior.
e.nativeEvent.preventDefault();

32
pandora_console/include/rest-api/models/VisualConsole/Container.php
View File

@ -223,32 +223,12 @@ final class Container extends Model
$backgroundImage = static::extractBackgroundImage($row);
if ($backgroundUrl === null && $backgroundImage !== null) {
$backgroundPath = 'images/console/background/'.$backgroundImage;
$width = (int) $row['width'];
$height = (int) $row['height'];
if ($width > 0 && $height > 0) {
$q = [
'getFile' => 1,
'thumb' => 1,
'thumb_size' => $width.'x'.$height,
'file' => '../../'.$backgroundPath,
];
$row['backgroundURL'] = ui_get_full_url(
'include/Image/image_functions.php?'.http_build_query($q),
false,
false,
false
);
} else {
$row['backgroundURL'] = ui_get_full_url(
$backgroundPath,
false,
false,
false
);
}
$row['backgroundURL'] = ui_get_full_url(
'images/console/background/'.$backgroundImage,
false,
false,
false
);
}
return \io_safe_output($row);

16
pandora_console/include/rest-api/models/VisualConsole/Item.php
View File

@ -880,6 +880,7 @@ class Item extends Model
global $config;
// Load side libraries.
include_once $config['homedir'].'/include/functions_ui.php';
if (\is_metaconsole()) {
\enterprise_include_once('include/functions_metaconsole.php');
\enterprise_include_once('meta/include/functions_ui_meta.php');
@ -889,7 +890,7 @@ class Item extends Model
$linkedModule = static::extractLinkedModule($data);
$linkedAgent = static::extractLinkedAgent($data);
$baseUrl = $config['homeurl'].'index.php';
$baseUrl = \ui_get_full_url('index.php');
// TODO: There's a feature to get the link from the label.
if (static::$useLinkedVisualConsole === true
@ -899,9 +900,9 @@ class Item extends Model
// Linked Visual Console.
$vcId = $linkedVisualConsole['linkedLayoutId'];
// The layout can be from another node.
$metaconsoleId = $linkedVisualConsole['metaconsoleId'];
$linkedLayoutAgentId = $linkedVisualConsole['linkedLayoutAgentId'];
if (empty($metaconsoleId) === true && \is_metaconsole()) {
if (empty($linkedLayoutAgentId) === true && \is_metaconsole()) {
/*
* A Visual Console from this console.
* We are in a metaconsole.
@ -916,7 +917,9 @@ class Item extends Model
'pure' => (int) $config['pure'],
]
);
} else if (empty($metaconsoleId) === true && !\is_metaconsole()) {
} else if (empty($linkedLayoutAgentId) === true
&& !\is_metaconsole()
) {
/*
* A Visual Console from this console.
* We are in a regular console.
@ -938,7 +941,7 @@ class Item extends Model
try {
$node = \metaconsole_get_connection_by_id(
$metaconsoleId
$linkedLayoutAgentId
);
return \ui_meta_get_node_url(
$node,
@ -1052,7 +1055,8 @@ class Item extends Model
return null;
}
}
} else if (static::$useLinkedAgent === true
} else if ((static::$useLinkedAgent === true
|| static::$useLinkedModule === true)
&& $linkedAgent['agentId'] !== null
&& $linkedAgent['agentId'] > 0
) {

30
pandora_console/include/rest-api/models/VisualConsole/Items/ModuleGraph.php
View File

@ -68,20 +68,20 @@ final class ModuleGraph extends Item
*
* @param array $data Unknown input data structure.
*
* @return string 'none', 'white' or 'black'. 'none' by default.
* @return string 'transparent', 'white' or 'black'. 'transparent' by default.
*/
private static function extractBackgroundType(array $data): string
{
$value = static::issetInArray($data, ['backgroundType', 'image']);
switch ($value) {
case 'none':
case 'transparent':
case 'white':
case 'black':
return $value;
default:
return 'none';
return 'transparent';
}
}
@ -193,6 +193,18 @@ final class ModuleGraph extends Item
}
}
/*
* About the 30 substraction to the graph height:
* The function which generates the graph doesn't respect the
* required height. It uses it for the canvas (the graph itself and
* their axes), but then it adds the legend. One item of the legend
* (one dataset) is about 30px, so we need to substract that height
* from the canvas to try to fit the element's height.
*
* PD: The custom graphs can have more datasets, but we only substract
* the height of one of it to replicate the legacy functionality.
*/
// Custom graph.
if (empty($customGraphId) === false) {
$customGraph = \db_get_row_filter(
@ -204,7 +216,7 @@ final class ModuleGraph extends Item
$params = [
'period' => $period,
'width' => $data['width'],
'height' => $data['height'],
'height' => ($data['height'] - 30),
'title' => '',
'unit_name' => null,
'show_alerts' => false,
@ -215,10 +227,10 @@ final class ModuleGraph extends Item
$paramsCombined = [
'id_graph' => $customGraphId,
'stacked' => $graph['stacked'],
'summatory' => $graph['summatory_series'],
'average' => $graph['average_series'],
'modules_series' => $graph['modules_series'],
'stacked' => $customGraph['stacked'],
'summatory' => $customGraph['summatory_series'],
'average' => $customGraph['average_series'],
'modules_series' => $customGraph['modules_series'],
];
$data['html'] = \graphic_combined_module(
@ -237,7 +249,7 @@ final class ModuleGraph extends Item
'period' => $period,
'show_events' => false,
'width' => $data['width'],
'height' => $data['height'],
'height' => ($data['height'] - 30),
'title' => \modules_get_agentmodule_name($moduleId),
'unit' => \modules_get_unit($moduleId),
'only_image' => $imageOnly,

3
pandora_console/include/visual-console-client/vc.main.css
View File

@ -2,7 +2,8 @@
margin: 0px auto;
position: relative;
background-repeat: no-repeat;
background-size: contain;
background-size: 100% 100%;
background-position: center;
}
.visual-console-item {

2
pandora_console/include/visual-console-client/vc.main.css.map
View File

@ -1 +1 @@
{"version":3,"sources":["webpack:///main.css","webpack:///styles.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,kBAAkB;EAClB,4BAA4B;EAC5B,wBAAwB;AAC1B;;AAEA;EACE,kBAAkB;EAClB,oBAAa;EAAb,oBAAa;EAAb,aAAa;EACb,2BAAuB;EAAvB,8BAAuB;MAAvB,2BAAuB;UAAvB,uBAAuB;EACvB,qBAAqB;EACrB,yBAAmB;MAAnB,sBAAmB;UAAnB,mBAAmB;EACnB,yBAAiB;KAAjB,sBAAiB;MAAjB,qBAAiB;UAAjB,iBAAiB;AACnB;;ACdA;EACE,wBAAwB;EACxB,0BAA2B;AAC7B;;AAEA,kBAAkB;;AAElB;EACE,oBAAa;EAAb,oBAAa;EAAb,aAAa;EACb,4BAAsB;EAAtB,6BAAsB;MAAtB,0BAAsB;UAAtB,sBAAsB;EACtB,wBAAuB;MAAvB,qBAAuB;UAAvB,uBAAuB;EACvB,qBAAqB;EACrB,0BAAqB;MAArB,qBAAqB;EACrB,yBAAmB;MAAnB,sBAAmB;UAAnB,mBAAmB;AACrB;;AAEA;EACE,6DAA6D;EAC7D,eAAe;;EAEf,0BAA0B;EAC1B,mCAAmC;EACnC,kCAAkC;EAClC,kCAAkC;EAClC,wCAAwC;AAC1C;;AAEA;EACE,eAAe;AACjB;;AAEA;EACE,eAAe;AACjB;;AAEA,iBAAiB;;AAEjB;EACE,qDAA6C;UAA7C,6CAA6C;AAC/C;;AAEA;EACE,sDAA8C;UAA9C,8CAA8C;AAChD;;AAEA;EACE,oDAA4C;UAA5C,4CAA4C;AAC9C","file":"vc.main.css","sourcesContent":["#visual-console-container {\n margin: 0px auto;\n position: relative;\n background-repeat: no-repeat;\n background-size: contain;\n}\n\n.visual-console-item {\n position: absolute;\n display: flex;\n flex-direction: initial;\n justify-items: center;\n align-items: center;\n user-select: text;\n}\n","@font-face {\n font-family: Alarm Clock;\n src: url(./alarm-clock.ttf);\n}\n\n/* Digital clock */\n\n.visual-console-item .digital-clock {\n display: flex;\n flex-direction: column;\n justify-content: center;\n justify-items: center;\n align-content: center;\n align-items: center;\n}\n\n.visual-console-item .digital-clock > span {\n font-family: \"Alarm Clock\", \"Courier New\", Courier, monospace;\n font-size: 50px;\n\n /* To improve legibility */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;\n}\n\n.visual-console-item .digital-clock > span.date {\n font-size: 25px;\n}\n\n.visual-console-item .digital-clock > span.timezone {\n font-size: 25px;\n}\n\n/* Analog clock */\n\n.visual-console-item .analogic-clock .hour-hand {\n animation: rotate-hour 43200s infinite linear;\n}\n\n.visual-console-item .analogic-clock .minute-hand {\n animation: rotate-minute 3600s infinite linear;\n}\n\n.visual-console-item .analogic-clock .second-hand {\n animation: rotate-second 60s infinite linear;\n}\n"],"sourceRoot":""}
{"version":3,"sources":["webpack:///main.css","webpack:///styles.css"],"names":[],"mappings":"AAAA;EACE,gBAAgB;EAChB,kBAAkB;EAClB,4BAA4B;EAC5B,0BAA0B;EAC1B,2BAA2B;AAC7B;;AAEA;EACE,kBAAkB;EAClB,oBAAa;EAAb,oBAAa;EAAb,aAAa;EACb,2BAAuB;EAAvB,8BAAuB;MAAvB,2BAAuB;UAAvB,uBAAuB;EACvB,qBAAqB;EACrB,yBAAmB;MAAnB,sBAAmB;UAAnB,mBAAmB;EACnB,yBAAiB;KAAjB,sBAAiB;MAAjB,qBAAiB;UAAjB,iBAAiB;AACnB;;ACfA;EACE,wBAAwB;EACxB,0BAA2B;AAC7B;;AAEA,kBAAkB;;AAElB;EACE,oBAAa;EAAb,oBAAa;EAAb,aAAa;EACb,4BAAsB;EAAtB,6BAAsB;MAAtB,0BAAsB;UAAtB,sBAAsB;EACtB,wBAAuB;MAAvB,qBAAuB;UAAvB,uBAAuB;EACvB,qBAAqB;EACrB,0BAAqB;MAArB,qBAAqB;EACrB,yBAAmB;MAAnB,sBAAmB;UAAnB,mBAAmB;AACrB;;AAEA;EACE,6DAA6D;EAC7D,eAAe;;EAEf,0BAA0B;EAC1B,mCAAmC;EACnC,kCAAkC;EAClC,kCAAkC;EAClC,wCAAwC;AAC1C;;AAEA;EACE,eAAe;AACjB;;AAEA;EACE,eAAe;AACjB;;AAEA,iBAAiB;;AAEjB;EACE,qDAA6C;UAA7C,6CAA6C;AAC/C;;AAEA;EACE,sDAA8C;UAA9C,8CAA8C;AAChD;;AAEA;EACE,oDAA4C;UAA5C,4CAA4C;AAC9C","file":"vc.main.css","sourcesContent":["#visual-console-container {\n margin: 0px auto;\n position: relative;\n background-repeat: no-repeat;\n background-size: 100% 100%;\n background-position: center;\n}\n\n.visual-console-item {\n position: absolute;\n display: flex;\n flex-direction: initial;\n justify-items: center;\n align-items: center;\n user-select: text;\n}\n","@font-face {\n font-family: Alarm Clock;\n src: url(./alarm-clock.ttf);\n}\n\n/* Digital clock */\n\n.visual-console-item .digital-clock {\n display: flex;\n flex-direction: column;\n justify-content: center;\n justify-items: center;\n align-content: center;\n align-items: center;\n}\n\n.visual-console-item .digital-clock > span {\n font-family: \"Alarm Clock\", \"Courier New\", Courier, monospace;\n font-size: 50px;\n\n /* To improve legibility */\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n text-rendering: optimizeLegibility;\n text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;\n}\n\n.visual-console-item .digital-clock > span.date {\n font-size: 25px;\n}\n\n.visual-console-item .digital-clock > span.timezone {\n font-size: 25px;\n}\n\n/* Analog clock */\n\n.visual-console-item .analogic-clock .hour-hand {\n animation: rotate-hour 43200s infinite linear;\n}\n\n.visual-console-item .analogic-clock .minute-hand {\n animation: rotate-minute 3600s infinite linear;\n}\n\n.visual-console-item .analogic-clock .second-hand {\n animation: rotate-second 60s infinite linear;\n}\n"],"sourceRoot":""}

2
pandora_console/include/visual-console-client/vc.main.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
pandora_console/include/visual-console-client/vc.main.min.js.map
View File

File diff suppressed because one or more lines are too long

24
pandora_console/operation/visual_console/public_view.php
View File

@ -92,6 +92,16 @@ echo '<img class="vc-qr" src="../../images/qrcode_icon_2.jpg"/>';
echo '</a>';
echo '</li>';
// Countdown.
echo '<li class="nomn">';
echo '<div class="vc-refr">';
echo '<div id="vc-refr-form">';
echo __('Refresh').':';
echo html_print_select(get_refresh_time_array(), 'refr', $refr, '', '', 0, true, false, false);
echo '</div>';
echo '</div>';
echo '</li>';
// Console name.
echo '<li class="nomn">';
echo '<div class="vc-title">'.$visualConsoleName.'</div>';
@ -113,6 +123,7 @@ if (!users_can_manage_group_all('AR')) {
$aclUserGroups = array_keys(users_get_groups(false, 'AR'));
}
$ignored_params['refr'] = '';
ui_require_javascript_file('pandora_visual_console');
include_javascript_d3();
visual_map_load_client_resources();
@ -159,7 +170,7 @@ $visualConsoleItems = VisualConsole::getItemsFromDB(
// Change the links.
if (prevProps && prevProps.id !== newProps.id) {
var regex = /(id=|id_visual_console=|id_layout=)\d+(&?)/gi;
var regex = /(id=|id_visual_console=|id_layout=|id_visualmap=)\d+(&?)/gi;
var replacement = '$1' + newProps.id + '$2';
// Tab links.
@ -186,8 +197,13 @@ $visualConsoleItems = VisualConsole::getItemsFromDB(
handleUpdate
);
$(document).ready(function () {
var controls = document.getElementById('vc-controls');
if (controls) autoHideElement(controls, 1000);
$(document).ready (function () {
var refr = <?php echo (int) $refr; ?>;
var href = "<?php echo ui_get_url_refresh($ignored_params); ?>";
$('select#refr').change(function (event) {
url = js_html_entity_decode( href ) + $('select#refr').val();
$(document).attr ("location", url);
});
});
</script>

29
pandora_console/operation/visual_console/view.php
View File

@ -133,7 +133,7 @@ $options['view']['active'] = true;
if (!is_metaconsole()) {
if (!$config['pure']) {
$options['pure']['text'] = '<a href="index.php?sec=network&sec2=operation/visual_console/render_view&id='.$visualConsoleId.'&pure=1">'.html_print_image(
$options['pure']['text'] = '<a href="index.php?sec=network&sec2=operation/visual_console/render_view&id='.$visualConsoleId.'&pure=1&refr='.$refr.'">'.html_print_image(
'images/full_screen.png',
true,
['title' => __('Full screen mode')]
@ -172,6 +172,16 @@ if ($pure === true) {
echo '</a>';
echo '</li>';
// Countdown.
echo '<li class="nomn">';
echo '<div class="vc-refr">';
echo '<div id="vc-refr-form">';
echo __('Refresh').':';
echo html_print_select(get_refresh_time_array(), 'refr', $refr, '', '', 0, true, false, false);
echo '</div>';
echo '</div>';
echo '</li>';
// Console name.
echo '<li class="nomn">';
echo '<div class="vc-title">'.$visualConsoleName.'</div>';
@ -207,6 +217,7 @@ if (!users_can_manage_group_all('AR')) {
$aclUserGroups = array_keys(users_get_groups(false, 'AR'));
}
$ignored_params['refr'] = '';
ui_require_javascript_file('pandora_visual_console');
include_javascript_d3();
visual_map_load_client_resources();
@ -261,7 +272,7 @@ $visualConsoleItems = VisualConsole::getItemsFromDB(
// Change the links.
if (prevProps && prevProps.id !== newProps.id) {
var regex = /(id=|id_visual_console=|id_layout=)\d+(&?)/gi;
var regex = /(id=|id_visual_console=|id_layout=|id_visualmap=)\d+(&?)/gi;
var replacement = '$1' + newProps.id + '$2';
// Tab links.
@ -294,8 +305,16 @@ $visualConsoleItems = VisualConsole::getItemsFromDB(
handleUpdate
);
$(document).ready(function () {
var controls = document.getElementById('vc-controls');
if (controls) autoHideElement(controls, 1000);
$(document).ready (function () {
var refr = <?php echo (int) $refr; ?>;
var pure = <?php echo (int) $config['pure']; ?>;
var href = "<?php echo ui_get_url_refresh($ignored_params); ?>";
if (pure) {
$('select#refr').change(function (event) {
url = js_html_entity_decode( href ) + $('select#refr').val();
$(document).attr ("location", url);
});
}
});
</script>

10
visual_console_client/src/Item.ts
View File

@ -361,8 +361,16 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
(this.props.isLinkEnabled && prevProps.link !== this.props.link))
) {
const container = this.createContainerDomElement();
// Add the children of the old element.
container.innerHTML = this.elementRef.innerHTML;
// Copy the attributes.
const attrs = this.elementRef.attributes;
for (let i = 0; i < attrs.length; i++) {
if (attrs[i].nodeName !== "id") {
container.setAttributeNode(attrs[i]);
}
}
// Replace the reference.
if (this.elementRef.parentNode !== null) {
this.elementRef.parentNode.replaceChild(container, this.elementRef);
}

2
visual_console_client/src/VisualConsole.ts
View File

@ -248,7 +248,7 @@ export default class VisualConsole {
if (a.isOnTop && !b.isOnTop) return 1;
else if (!a.isOnTop && b.isOnTop) return -1;
else if (a.id < b.id) return 1;
else if (a.id > b.id) return 1;
else return -1;
});

4
visual_console_client/src/items/Percentile.ts
View File

@ -251,10 +251,10 @@ export default class Percentile extends Item<PercentileProps> {
private getProgress(): number {
const minValue = this.props.minValue || 0;
const maxValue = this.props.maxValue || 100;
const value = this.props.value || 100;
const value = this.props.value == null ? 0 : this.props.value;
if (value <= minValue) return 0;
else if (value >= maxValue) return 100;
else return ((value - minValue) / (maxValue - minValue)) * 100;
else return Math.trunc(((value - minValue) / (maxValue - minValue)) * 100);
}
}

3
visual_console_client/src/main.css
View File

@ -2,7 +2,8 @@
margin: 0px auto;
position: relative;
background-repeat: no-repeat;
background-size: contain;
background-size: 100% 100%;
background-position: center;
}
.visual-console-item {