Custom Maps configurable new map defaults (#16212)

This commit is contained in:
Tony Murray 2024-07-17 16:05:44 -05:00 committed by GitHub
parent 1cceafb887
commit cf7b025fb1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
9 changed files with 409 additions and 24 deletions

View File

@ -48,9 +48,9 @@ class CustomMapController extends Controller
'maps' => CustomMap::orderBy('name')->get(['custom_map_id', 'name', 'menu_group'])->groupBy('menu_group')->sortKeys(),
'name' => 'New Map',
'menu_group' => null,
'node_align' => 10,
'edge_separation' => 10,
'reverse_arrows' => 0,
'node_align' => Config::get('custom_map.node_align', 10),
'edge_separation' => Config::get('custom_map.edge_seperation', 10),
'reverse_arrows' => Config::get('custom_map.reverse_arrows', false),
'legend' => [
'x' => -1,
'y' => -1,
@ -59,10 +59,11 @@ class CustomMapController extends Controller
'hide_overspeed' => 0,
'font_size' => 14,
],
'background_type' => null,
'background_type' => Config::get('custom_map.background_type', 'none'),
'background_data' => Config::get('custom_map.background_data'),
'map_conf' => [
'height' => '800px',
'width' => '1800px',
'width' => Config::get('custom_map.width', '1800px'),
'height' => Config::get('custom_map.height', '800px'),
'interaction' => [
'dragNodes' => true,
'dragView' => false,
@ -154,7 +155,57 @@ class CustomMapController extends Controller
public function store(CustomMapSettingsRequest $request): JsonResponse
{
return $this->update($request, new CustomMap);
// create a new map with default values
$map = new CustomMap;
$map->options = [
'interaction' => [
'dragNodes' => false,
'dragView' => false,
'zoomView' => false,
],
'manipulation' => [
'enabled' => false,
],
'physics' => [
'enabled' => false,
],
];
$map->newnodeconfig = [
'borderWidth' => 1,
'color' => [
'border' => Config::get('custom_map.node_border', '#2B7CE9'),
'background' => Config::get('custom_map.node_background', '#D2E5FF'),
],
'font' => [
'color' => Config::get('custom_map.node_font_color', '#343434'),
'size' => Config::get('custom_map.node_font_size', 14),
'face' => Config::get('custom_map.node_font_face', 'arial'),
],
'icon' => [],
'label' => true,
'shape' => Config::get('custom_map.node_type', 'box'),
'size' => Config::get('custom_map.node_size', 25),
];
$map->newedgeconfig = [
'arrows' => [
'to' => [
'enabled' => true,
],
],
'smooth' => [
'type' => 'dynamic',
],
'font' => [
'color' => Config::get('custom_map.edge_font_color', '#343434'),
'size' => Config::get('custom_map.edge_font_size', 12),
'face' => Config::get('custom_map.edge_font_face', 'arial'),
],
'label' => true,
];
$map->background_type = Config::get('custom_map.background_type', 'none');
$map->background_data = Config::get('custom_map.background_data');
return $this->update($request, $map);
}
public function update(CustomMapSettingsRequest $request, CustomMap $map): JsonResponse

View File

@ -59,13 +59,6 @@ class CustomMap extends BaseModel
'background_data',
];
// default values for attributes
protected $attributes = [
'options' => '{"interaction":{"dragNodes":false,"dragView":false,"zoomView":false},"manipulation":{"enabled":false},"physics":{"enabled":false}}',
'newnodeconfig' => '{"borderWidth":1,"color":{"border":"#2B7CE9","background":"#D2E5FF"},"font":{"color":"#343434","size":14,"face":"arial"},"icon":[],"label":true,"shape":"box","size":25}',
'newedgeconfig' => '{"arrows":{"to":{"enabled":true}},"smooth":{"type":"dynamic"},"font":{"color":"#343434","size":12,"face":"arial"},"label":true}',
];
/**
* Get background data intended to be passed to javascript to configure the background
*/

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,11 +1,11 @@
{
"/js/app.js": "/js/app.js?id=1ecd9b13d60fe23a9729684f4d9dc663",
"/js/app.js": "/js/app.js?id=6fd1d20a8df5d99d9822ab7476b72a6e",
"/js/manifest.js": "/js/manifest.js?id=2eb19d92c19953027907b72ff5963ebb",
"/css/vendor.css": "/css/vendor.css?id=d520734ded0ec75b0a572aa8db1c2161",
"/css/app.css": "/css/app.css?id=71ba24df332b4132f71ad82f23679d4f",
"/css/app.css": "/css/app.css?id=d5329c44307234e278d193efbf78e05a",
"/js/vendor.js": "/js/vendor.js?id=3b22b85b4e5a64e37dd954c0b147b3f3",
"/js/lang/de.js": "/js/lang/de.js?id=f80b2c49bd4d1587d4747d189c566ffa",
"/js/lang/en.js": "/js/lang/en.js?id=5f909f26f3509a880924343a6acc7df4",
"/js/lang/en.js": "/js/lang/en.js?id=7f4b534757a8fe8d66343da15b70cb5d",
"/js/lang/fr.js": "/js/lang/fr.js?id=7e43fd1965beef315f0b416fd8607231",
"/js/lang/it.js": "/js/lang/it.js?id=7827375adf92766a477291c48fa1b360",
"/js/lang/ru.js": "/js/lang/ru.js?id=f6b7c078755312a0907c4f983991cc52",

View File

@ -78,6 +78,7 @@ return [
],
'webui' => [
'availability-map' => ['name' => 'Availability Map Settings'],
'custom-map' => ['name' => 'Custom Map Settings'],
'graph' => ['name' => 'Graph Settings'],
'dashboard' => ['name' => 'Dashboard Settings'],
'port-descr' => ['name' => 'Interface Description Parsing'],
@ -497,6 +498,94 @@ return [
'description' => 'Core Port Types',
'help' => 'Ports of the listed description type(s) will be shown under the core ports menu entry. See Interface Description Parsing docs for more info.',
],
'custom_map' => [
'background_type' => [
'description' => 'Background Type',
'help' => 'Default background type for new maps. Requires background data set.',
],
'background_data' => [
'color' => [
'description' => 'Background Color',
'help' => 'Initial color for map background',
],
'lat' => [
'description' => 'Background Map Lattitude',
'help' => 'Initial lattitude for background geo map',
],
'lng' => [
'description' => 'Background Map Longitude',
'help' => 'Initial longitude for background geo map',
],
'layer' => [
'description' => 'Background Map Layer',
'help' => 'Initial map layer for background geo map',
],
'zoom' => [
'description' => 'Background Map Zoom',
'help' => 'Initial map zoom for background geo map',
],
],
'edge_font_color' => [
'description' => 'Edge Text Color',
'help' => 'Default font color for edge labels',
],
'edge_font_face' => [
'description' => 'Edge Font',
'help' => 'Default font face for edge labels',
],
'edge_font_size' => [
'description' => 'Edge Text Size',
'help' => 'Default font size for edge labels',
],
'edge_seperation' => [
'description' => 'Edge Seperation',
'help' => 'Default edge seperation for new maps',
],
'height' => [
'description' => 'Map Height',
'help' => 'Default map height for new maps',
],
'node_align' => [
'description' => 'Node Alignment',
'help' => 'Default node aligment for new maps',
],
'node_background' => [
'description' => 'Node Background',
'help' => 'Default background color for node labels',
],
'node_border' => [
'description' => 'Node Border',
'help' => 'Default border color for node labels',
],
'node_font_color' => [
'description' => 'Node Text Color',
'help' => 'Default font color for node labels',
],
'node_font_face' => [
'description' => 'Node Font',
'help' => 'Default font for node labels',
],
'node_font_size' => [
'description' => 'Node Text Size',
'help' => 'Default font size for node labels',
],
'node_size' => [
'description' => 'Node Size',
'help' => 'Default size for nodes',
],
'node_type' => [
'description' => 'Node Display Type',
'help' => 'Default display type for nodes',
],
'reverse_arrows' => [
'description' => 'Reverse Edge Arrows',
'help' => 'Default arrow direction. Towards center (default) or towards ends',
],
'width' => [
'description' => 'Map Width',
'help' => 'Default map width for new maps',
],
],
'customers_descr' => [
'description' => 'Customer Port Types',
'help' => 'Ports of the listed description type(s) will be shown under the customers ports menu entry. See Interface Description Parsing docs for more info.',

View File

@ -963,6 +963,210 @@
"default": [""],
"type": "array"
},
"custom_map.background_type": {
"default": "none",
"type": "select",
"group": "webui",
"section": "custom-map",
"order": 98,
"options": {
"color": "Color",
"map": "Map",
"none": "None"
}
},
"custom_map.background_data.color": {
"default": "#badaee",
"type": "color",
"group": "webui",
"section": "custom-map",
"order": 100,
"options": {
"Streets": "Streets",
"Sattelite": "Sattelite",
"Topography": "Topography"
},
"when": {
"setting": "custom_map.background_type",
"operator": "equals",
"value": "color"
}
},
"custom_map.background_data.lat": {
"default": 40,
"type": "float",
"group": "webui",
"section": "custom-map",
"order": 101,
"when": {
"setting": "custom_map.background_type",
"operator": "equals",
"value": "map"
}
},
"custom_map.background_data.layer": {
"default": null,
"type": "select",
"group": "webui",
"section": "custom-map",
"order": 104,
"options": {
"Streets": "Streets",
"Sattelite": "Sattelite",
"Topography": "Topography"
},
"when": {
"setting": "custom_map.background_type",
"operator": "equals",
"value": "map"
}
},
"custom_map.background_data.lng": {
"default": -20,
"type": "float",
"group": "webui",
"section": "custom-map",
"order": 102,
"when": {
"setting": "custom_map.background_type",
"operator": "equals",
"value": "map"
}
},
"custom_map.background_data.zoom": {
"default": 3,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 103,
"when": {
"setting": "custom_map.background_type",
"operator": "equals",
"value": "map"
}
},
"custom_map.edge_font_color": {
"default": "#343434",
"type": "color",
"group": "webui",
"section": "custom-map",
"order": 53
},
"custom_map.edge_font_face": {
"default": "arial",
"type": "text",
"group": "webui",
"section": "custom-map",
"order": 51
},
"custom_map.edge_font_size": {
"default": 12,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 52
},
"custom_map.edge_seperation": {
"default": 10,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 21
},
"custom_map.height": {
"default": "1800px",
"type": "text",
"group": "webui",
"section": "custom-map",
"order": 2
},
"custom_map.node_align": {
"default": 10,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 22
},
"custom_map.node_background": {
"default": "#D2E5FF",
"type": "color",
"group": "webui",
"section": "custom-map",
"order": 41
},
"custom_map.node_border": {
"default": "#2B7CE9",
"type": "color",
"group": "webui",
"section": "custom-map",
"order": 42
},
"custom_map.node_font_color": {
"default": "#343434",
"type": "color",
"group": "webui",
"section": "custom-map",
"order": 45
},
"custom_map.node_font_face": {
"default": "arial",
"type": "text",
"group": "webui",
"section": "custom-map",
"order": 43
},
"custom_map.node_font_size": {
"default": 14,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 44
},
"custom_map.node_size": {
"default": 25,
"type": "integer",
"group": "webui",
"section": "custom-map",
"order": 40
},
"custom_map.node_type": {
"default": "box",
"type": "select",
"group": "webui",
"section": "custom-map",
"order": 39,
"options": {
"box": "Box",
"circle": "Circle",
"database": "Database",
"ellipse": "Ellipse",
"text": "Text",
"device_image": "Device Image",
"device_image_circle": "Device Image (Circular)",
"diamond": "Diamond",
"dot": "Dot",
"star": "Star",
"triangle": "Triangle",
"triangle_inverted": "Triangle Inverted",
"hexagon": "Hexagon",
"square": "Square",
"icon": "Icon"
}
},
"custom_map.reverse_arrows": {
"default": false,
"type": "boolean",
"group": "webui",
"section": "custom-map",
"order": 23
},
"custom_map.width": {
"default": "800px",
"type": "text",
"group": "webui",
"section": "custom-map",
"order": 1
},
"customers_descr": {
"default": ["cust"],
"type": "array",

View File

@ -0,0 +1,48 @@
<!--
- SettingColor.vue
-
- Description-
-
- This program is free software: you can redistribute it and/or modify
- it under the terms of the GNU General Public License as published by
- the Free Software Foundation, either version 3 of the License, or
- (at your option) any later version.
-
- This program is distributed in the hope that it will be useful,
- but WITHOUT ANY WARRANTY; without even the implied warranty of
- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.See the
- GNU General Public License for more details.
-
- You should have received a copy of the GNU General Public License
- along with this program. If not, see <https://www.gnu.org/licenses/>.
-
- @package LibreNMS
- @link https://www.librenms.org
- @copyright 2019 Tony Murray
- @author Tony Murray <murraytony@gmail.com>
-->
<template>
<input type="color" class="form-control"
:name="name"
:value="value"
@input="$emit('input', $event.target.value)"
:required="required"
:disabled="disabled"
>
</template>
<script>
import BaseSetting from "./BaseSetting";
export default {
name: "SettingColor",
mixins: [BaseSetting],
}
</script>
<style scoped>
.form-control {
padding-right: 12px;
}
</style>

View File

@ -67,11 +67,11 @@
error: '',
resetBackground() {
this.type = this.initial_type;
this.color = 'color' in this.initial_data ? this.initial_data.color : '#badaee';
this.lat = 'lat' in this.initial_data ? this.initial_data.lat : 40;
this.lng = 'lng' in this.initial_data ? this.initial_data.lng : -20;
this.zoom = 'zoom' in this.initial_data ? this.initial_data.zoom : 3;
this.layer = 'layer' in this.initial_data ? this.initial_data.layer : null;
this.color = 'color' in this.initial_data ? this.initial_data.color : '{{ Config::get('custom_map.background_data.color') }}';
this.lat = 'lat' in this.initial_data ? this.initial_data.lat : {{ (float) Config::get('custom_map.background_data.lat') }};
this.lng = 'lng' in this.initial_data ? this.initial_data.lng : {{ (float) Config::get('custom_map.background_data.lng') }};
this.zoom = 'zoom' in this.initial_data ? this.initial_data.zoom : {{ (int) Config::get('custom_map.background_data.zoom') }};
this.layer = 'layer' in this.initial_data ? this.initial_data.layer : {{ Js::from(Config::get('custom_map.background_data.layer')) }};
this.image = this.initial_data['original_filename'];
this.image_content = null;
this.show_image_export = (! 'engine' in this.initial_data) || ! ['google', 'bing'].includes(this.initial_data['engine']);