diff --git a/docs/HW_INSTALL.md b/docs/HW_INSTALL.md index 68681b27..97c055da 100755 --- a/docs/HW_INSTALL.md +++ b/docs/HW_INSTALL.md @@ -5,7 +5,7 @@ To download and install NetAlertX on the hardware/server directly use the `curl` > [!NOTE] > This is an Experimental feature 🧪 and it relies on community support. > -> 🙏 Looking for maintainers for this installation method 🙂 Curent community volunteers: +> 🙏 Looking for maintainers for this installation method 🙂 Current community volunteers: > - [slammingprogramming](https://github.com/slammingprogramming) > > There is no guarantee that the install script or any other script will gracefully handle other installed software. diff --git a/docs/NETWORK_TREE.md b/docs/NETWORK_TREE.md index 67fb5917..fe113845 100755 --- a/docs/NETWORK_TREE.md +++ b/docs/NETWORK_TREE.md @@ -1,63 +1,87 @@ -## How to setup your Network page +## How to Set Up Your Network Page -Make sure you have a root device with the MAC `Internet` (No other MAC addresses are currently supported as the root node) set to a network device type (e.g.: **Type**:`Router`). +The **Network** page lets you map how devices connect — visually and logically. +It’s especially useful for planning infrastructure, assigning parent-child relationships, and spotting gaps. -> 💡 Tip: You can add dummy devices via the [Create dummy device](./DEVICE_MANAGEMENT.md#dummy-devices) button in the Devices listing page. +To get started, you’ll need to define at least one root node and mark certain devices as network nodes (like Switches or Routers). -> 💡 Tip: Export your configuration of the Network and Devices once in a while via the Export CSV feature under **Maintenance** -> **Backup/Restore** -> **CSV Export**. +--- -## ⚡Quick setup: +Start by creating a root device with the MAC address `Internet`, if the application didn’t create one already. +This is the only MAC currently supported as a root network node. +Set its **Type** to something valid in a networking context — for example: `Router` or `Gateway`. -* Go to a Device you want to use as network device (network nodes, such as a Switch). -* Set the **Type** of such a device to one of the following: AP, Firewall, Gateway, PLC, Powerline, Router, Switch, USB LAN Adapter, USB WIFI Adapter and WLAN (you can create a custom network type device with in Settings -> General -> `NETWORK_DEVICE_TYPES`). -* Save and go to Network where the devices you've marked as network devices (by selecting the Type as mentioned above) will show up as tabs. -* You can now assign the Unassigend devices to the network node. -* If port is empty or 0 a wifi icon is rendered, otherwise a ethernet port icon. +> [!TIP] +> If you don’t have one, use the [Create new device](./DEVICE_MANAGEMENT.md#dummy-devices) button on the **Devices** page to add a root device. +--- -> [!NOTE] -> -> [Bulk-edit devices](./DEVICES_BULK_EDITING.md) by using the _CSV Export_ functionality in the _Maintenance_ section. You can use this to fix `Internet` node assignment issues. +## ⚡ Quick Setup -## 🔍Detailed example: +1. Open the device you want to use as a network node (e.g. a Switch). +2. Set its **Type** to one of the following: + `AP`, `Firewall`, `Gateway`, `PLC`, `Powerline`, `Router`, `Switch`, `USB LAN Adapter`, `USB WIFI Adapter`, `WLAN` + *(Or add custom types under **Settings → General → `NETWORK_DEVICE_TYPES`**.)* +3. Save the device. +4. Go to the **Network** page — supported device types will appear as tabs. +5. Use the **Assign** button to connect unassigned devices to a network node. +6. If the **Port** is `0` or empty, a Wi-Fi icon is shown. Otherwise, an Ethernet icon appears. -In this example you will setup a device named `rapberrypi` as a `Switch` in our network. +![Network tree details](./img/NETWORK_TREE/Network_Sample.png) -### 1. Device details page +> [!NOTE] +> Use [bulk editing](./DEVICES_BULK_EDITING.md) with _CSV Export_ to fix `Internet` root assignments or update many devices at once. -- Go to the `Devices` (1) page: +--- -![Device details](./img/NETWORK_TREE/Device_Details_Network_Type.png) +## Example: Setting up a `raspberrypi` as a Switch -- In the (2) `Details` tab navigate to the the `Type` (3) dropdown and select the type `Switch` (4). +Let’s walk through setting up a device named `raspberrypi` to act as a network Switch that other devices connect through. -> Note: Only the following device types will show up as selectable Network nodes ( = devices you can connect other devices to): -> AP, Firewall, Gateway, Hypervisor, PLC, Powerline, Router, Switch, USB LAN Adapter, USB WIFI Adapter and WLAN. Custom types can be added via the `NETWORK_DEVICE_TYPES` setting. +--- -- Assign a device to your root device from the `Node` (5) dropdown which has the MAC `Internet` (6) (Your name may differ, but the MAC needs to be set to `Internet` - this is done by default). +### 1. Set Device Type and Parent -- Save your changes (7) +- Go to the **Devices** page +- Open the device detail view for `raspberrypi` -### 2. Network page +![Device details](./img/NETWORK_TREE/Network_Device_Details.png) -- Navigate to your `Network` (1) page: +- In the **Type** dropdown, select `Switch` -![Network page](./img/NETWORK_TREE/Network_Page.png) +![Parent Node dropdown](./img/NETWORK_TREE/Network_Device_ParentDropdown.png) -- Notice the newly added `raspberrypi` (2) tab which now represents a network node, also showing up in the tree (3). -- As we asssigned the `raspberrypi` in the previous (1) Device details page section to the `Internet` parent network node in step (6), the link is also showing up in the tree diagram (4) -- We can now assign the device `(AppleTV)` (5) to this `raspberrypi` node, representing a network Switch in this example +- Optionally assign a **Parent Node** (where this device connects to) and the **Relationship type** of the connection. The `nic` relationship type can affect parent notifications — see the setting description and [Notifications documentation](./NOTIFICATIONS.md) for more. -### 3. Network page with 2 levels +> [!NOTE] +> Only certain device types can act as network nodes: +> `AP`, `Firewall`, `Gateway`, `Hypervisor`, `PLC`, `Powerline`, `Router`, `Switch`, `USB LAN Adapter`, `USB WIFI Adapter`, `WLAN` +> You can add custom types via the `NETWORK_DEVICE_TYPES` setting. -- After clicking the `Assign` button in the previous section, the `(AppleTV)` (1) device is now connected to our `raspberrypi` (2). +- Click **Save** -![Network page with 2 levels](./img/NETWORK_TREE/Network_Page_2_Levels.png) +--- -- You can see the `raspberrypi` represents the Network node type `Switch` (3) -- The `(AppleTV)` to `raspberrypi` connection is also displayed in the table of `Connected devices` (4). -- You can also see that our `raspberrypi` node is connected to it's Parent network device node with the MAC `Internet` (5). This connection again shows up in the tree (6) as well. +### 2. Confirm It Appears as a Network Node +- Go to the **Network** page +![Network page](./img/NETWORK_TREE/Network_Assign.png) +- You’ll now see a `raspberrypi` tab — it’s recognized as a network node (Switch) +- You can assign other devices to it +--- + +### 3. Assign Connected Devices + +- Use the **Assign** button to link other devices (e.g. PCs) to `raspberrypi` + +![Assigned nodes](./img/NETWORK_TREE/Network_Assigned_Nodes.png) + +- Once assigned, devices will show as connected to the `raspberrypi` switch node +- Relationship lines may vary in color based on the selected Relationship type. These are editable on the device details. + +![Hover detail](./img/NETWORK_TREE/Network_tree_setup_hover.png) + +Happy with your setup? [Back it up](./BACKUPS.md). diff --git a/docs/NOTIFICATIONS.md b/docs/NOTIFICATIONS.md index 291f1f43..a8b6a8ea 100755 --- a/docs/NOTIFICATIONS.md +++ b/docs/NOTIFICATIONS.md @@ -15,11 +15,12 @@ There are 4 ways how to influence notifications: ![Device notification settings](./img/NOTIFICATIONS/Device-notification-settings.png) -There are 4 settings on the device for influencing notifications. You can: +The following device properties influence notifications. You can: 1. **Alert Events** - Enables alerts of connections, disconnections, IP changes (down and down reconnected notifications are still sent even if this is disabled). 2. **Alert Down** - Alerts when a device goes down. This setting overrides a disabled **Alert Events** setting, so you will get a notification of a device going down even if you don't have **Alert Events** ticked. Disabling this will disable down and down reconnected notifications on the device. 3. **Skip repeated notifications**, if for example you know there is a temporary issue and want to pause the same notification for this device for a given time. +4. **Require NICs Online** - Indicates whether this device should be considered online only if all associated NICs (devices with the `nic` relationship type) are online. If disabled, the device is considered online if any NIC is online. If a NIC is online it sets the parent (this) device's status to online irrespectivelly of the detected device's status. The Relationship type is set on the childern device. > [!NOTE] > Please read through the [NTFPRCS plugin](https://github.com/jokob-sk/NetAlertX/blob/main/front/plugins/notification_processing/README.md) documentation to understand how device and global settings influence the notification processing. diff --git a/docs/img/NETWORK_TREE/Device_Details_Network_Type.png b/docs/img/NETWORK_TREE/Device_Details_Network_Type.png deleted file mode 100755 index e01d3aad..00000000 Binary files a/docs/img/NETWORK_TREE/Device_Details_Network_Type.png and /dev/null differ diff --git a/docs/img/NETWORK_TREE/Network_Assign.png b/docs/img/NETWORK_TREE/Network_Assign.png new file mode 100755 index 00000000..c21f2810 Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Assign.png differ diff --git a/docs/img/NETWORK_TREE/Network_Assigned_Nodes.png b/docs/img/NETWORK_TREE/Network_Assigned_Nodes.png new file mode 100755 index 00000000..5092a82e Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Assigned_Nodes.png differ diff --git a/docs/img/NETWORK_TREE/Network_Device_Details.png b/docs/img/NETWORK_TREE/Network_Device_Details.png new file mode 100755 index 00000000..a8173093 Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Device_Details.png differ diff --git a/docs/img/NETWORK_TREE/Network_Device_ParentDropdown.png b/docs/img/NETWORK_TREE/Network_Device_ParentDropdown.png new file mode 100755 index 00000000..5481665c Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Device_ParentDropdown.png differ diff --git a/docs/img/NETWORK_TREE/Network_Device_type.png b/docs/img/NETWORK_TREE/Network_Device_type.png new file mode 100755 index 00000000..dcd1a775 Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Device_type.png differ diff --git a/docs/img/NETWORK_TREE/Network_Page.png b/docs/img/NETWORK_TREE/Network_Page.png deleted file mode 100755 index 790bb40c..00000000 Binary files a/docs/img/NETWORK_TREE/Network_Page.png and /dev/null differ diff --git a/docs/img/NETWORK_TREE/Network_Page_2_Levels.png b/docs/img/NETWORK_TREE/Network_Page_2_Levels.png deleted file mode 100755 index af558523..00000000 Binary files a/docs/img/NETWORK_TREE/Network_Page_2_Levels.png and /dev/null differ diff --git a/docs/img/NETWORK_TREE/Network_Sample.png b/docs/img/NETWORK_TREE/Network_Sample.png new file mode 100755 index 00000000..69214478 Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_Sample.png differ diff --git a/docs/img/NETWORK_TREE/Network_tree_setup_hover.png b/docs/img/NETWORK_TREE/Network_tree_setup_hover.png new file mode 100755 index 00000000..49334f4b Binary files /dev/null and b/docs/img/NETWORK_TREE/Network_tree_setup_hover.png differ diff --git a/front/css/app.css b/front/css/app.css index 0f71eaf6..e3f7c8fa 100755 --- a/front/css/app.css +++ b/front/css/app.css @@ -1549,7 +1549,7 @@ input[readonly] { #deviceDetailsEdit .select2-container--default .select2-selection--multiple .select2-selection__choice a { - color: #bec5cb; + color: #fff; } #deviceDetailsEdit .iconPreview svg diff --git a/front/css/dark-patch.css b/front/css/dark-patch.css index 700e56da..3929bf9a 100755 --- a/front/css/dark-patch.css +++ b/front/css/dark-patch.css @@ -732,6 +732,36 @@ input[type="password"]::-webkit-caps-lock-indicator { background-color: #000 !important; } + +.select2-container--default .select2-selection--single { + color: initial !important; + background-color: #353c42 !important; +} + +/* Chevron color */ +.select2-container .select2-selection__arrow::after { + color: #bec5cb; +} + +/* Chevron color */ +.select2-selection .select2-selection--single { + color: #bec5cb; +} + +.select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single { + border-color: #3d444b !important; +} + +.select2-container--default .select2-selection--single .select2-selection__rendered .custom-chip +{ + color: #bec5cb; +} + +#hover-box +{ + background-color: #353c42 !important; +} + .callout code { background-color: #fff !important; color:#000 !important; diff --git a/front/devices.php b/front/devices.php index 52bfa502..4d954ead 100755 --- a/front/devices.php +++ b/front/devices.php @@ -785,6 +785,7 @@ function initializeDatatable (status) { data-ip="${rowData[mapIndx(8)]}" data-mac="${rowData[mapIndx(11)]}" data-vendor="${rowData[mapIndx(17)]}" + data-type="${rowData[mapIndx(2)]}" data-firstseen="${rowData[mapIndx(6)]}" data-lastseen="${rowData[mapIndx(7)]}" data-relationship="${rowData[mapIndx(28)]}" diff --git a/front/js/ui_components.js b/front/js/ui_components.js index 0227de4f..fc7b63de 100755 --- a/front/js/ui_components.js +++ b/front/js/ui_components.js @@ -692,6 +692,7 @@ function initSelect2() { data-ip="${device.devLastIP}" data-mac="${device.devMac}" data-vendor="${device.devVendor}" + data-type="${device.devType}" data-lastseen="${device.devLastConnection}" data-firstseen="${device.devFirstConnection}" data-relationship="${device.devParentRelType}" @@ -821,6 +822,7 @@ function initHoverNodeInfo() { const ip = $el.data('ip') || 'N/A'; const mac = $el.data('mac') || 'N/A'; const vendor = $el.data('vendor') || 'Unknown'; + const type = $el.data('type') || 'Unknown'; const lastseen = $el.data('lastseen') || 'Unknown'; const firstseen = $el.data('firstseen') || 'Unknown'; const relationship = $el.data('relationship') || 'Unknown'; @@ -844,6 +846,9 @@ function initHoverNodeInfo() {
Vendor: ${vendor}
+
+ Type: ${type}
+
First seen: ${firstseen}
diff --git a/front/network.php b/front/network.php index fd8dc605..3cd00cc2 100755 --- a/front/network.php +++ b/front/network.php @@ -476,7 +476,7 @@ `select *, CASE WHEN devAlertDown !=0 AND devPresentLastScan=0 THEN "Down" WHEN devPresentLastScan=1 THEN "On-line" ELSE "Off-line" END as devStatus - from Devices`))}`; + from Devices where devIsArchived = 0 `))}`; $.get(apiUrl, function (data) { @@ -727,7 +727,6 @@ function initTree(myHierarchy) myTree = Treeviz.create({ htmlId: "networkTree", renderNode: nodeData => { - (!emptyArr.includes(nodeData.data.port )) ? port = nodeData.data.port : port = ""; @@ -744,7 +743,7 @@ function initTree(myHierarchy) style="width:${emSize}em;height:${emSize}em"> ${portHtml}
+ style="margin-left:-${emSize*0.7}em;"> ${portBckgIcon}
`; collapseExpandIcon = nodeData.data.hiddenChildren ? @@ -768,13 +767,14 @@ function initTree(myHierarchy) return result = `