Docs

Update DEVICE_MANAGEMENT.md

.github/ISSUE_TEMPLATE/i-have-an-issue.md

@@ -12,35 +12,31 @@ assignees: ''
 
 **Paste last few lines from `pialert.log`**
 
+> You can use `tail -20 /home/pi/pialert/front/log/pialert.log`
+
 ```
-
-paste here
-
+paste_here
 ```
 
 **Paste your `pialert.conf` (remove personal info)**
 
 ```
-
-paste here
-
+paste_here
 ```
 
 **Paste your `docker-compose.yml` and `.env` (remove personal info)**
 
 `docker-compose.yml` 
-```
-
-paste here
 
 ```
-
+paste_here
+```
 
 `.env` 
-```
-
-paste here
 
 ```
+paste_here
+```
+
 **Screenshots**
 If applicable, add screenshots to help explain your problem.

.github/workflows/docker_dev.yml

@@ -31,7 +31,7 @@ jobs:
 
       - name: Docker meta
         id: meta
-        uses: docker/metadata-action@v3
+        uses: docker/metadata-action@v4
         with:
           # list of Docker images to use as base name for tags
           images: |

.github/workflows/docker_prod.yml

@@ -12,7 +12,8 @@ name: Publish Docker image
 on:
   release:
     types: [published]
-
+    tags:
+      - '*.*.*'
 jobs:
   docker:
     runs-on: ubuntu-latest
@@ -32,21 +33,19 @@ jobs:
 
       - name: Docker meta
         id: meta
-        uses: docker/metadata-action@v3
+        uses: docker/metadata-action@v4
         with:
           # list of Docker images to use as base name for tags
           images: |
             jokobsk/pi.alert
           # generate Docker tags based on the following events/attributes
           tags: |
-            type=raw,value=latest
-            type=schedule
-            type=ref,event=branch
+            type=semver,pattern={{version}},value=${{ inputs.version }}
+            type=semver,pattern={{major}}.{{minor}},value=${{ inputs.version }}
+            type=semver,pattern={{major}},value=${{ inputs.version }}
+            type=ref,event=branch,suffix=-{{ sha }}
             type=ref,event=pr
-            type=semver,pattern={{version}}
-            type=semver,pattern={{major}}.{{minor}}
-            type=semver,pattern={{major}}
-            type=sha
+            type=raw,value=latest,enable=${{ github.ref == 'refs/heads/main' || startsWith(github.ref, 'refs/tags/') }}
       - name: Login to DockerHub
         if: github.event_name != 'pull_request'
         uses: docker/login-action@v2

.gitignore

@@ -1,4 +1,8 @@
+.vscode
 .DS_Store
 config/pialert.conf
 db/*
 front/log/*
+front/plugins/**/*.log
+**/%40eaDir/
+**/@eaDir/

Dockerfile

@@ -7,8 +7,8 @@ ENV USER=pi USER_ID=1000 USER_GID=1000 TZ=Europe/London PORT=20211
 # Todo, do we still need all these packages? I can already see sudo which isn't needed
 
 RUN apt-get update \
-    && apt-get install --no-install-recommends tini ca-certificates curl libwww-perl arp-scan perl apt-utils cron sudo nginx-light php php-cgi php-fpm php-sqlite3 php-curl sqlite3 dnsutils net-tools python3 iproute2 nmap python3-pip zip -y \
-    && pip3 install requests paho-mqtt scapy cron-converter pytz \    
+    && apt-get install --no-install-recommends tini snmp ca-certificates curl libwww-perl arp-scan perl apt-utils cron sudo nginx-light php php-cgi php-fpm php-sqlite3 php-curl sqlite3 dnsutils net-tools python3 iproute2 nmap python3-pip zip -y \
+    && pip3 install requests paho-mqtt scapy cron-converter pytz json2table dhcp-leases pyunifi \
     && update-alternatives --install /usr/bin/python python /usr/bin/python3 10 \
     && apt-get clean autoclean \
     && apt-get autoremove \

README.md

@@ -7,15 +7,14 @@ Scans for devices connected to your WIFI / LAN and alerts you if new and unknown
 
 ![Main screen][main]
 
-
 # 🐳 Docker image 
-[![Docker](https://img.shields.io/github/actions/workflow/status/jokob-sk/Pi.Alert/docker_prod.yml?branch=main&label=Build&logo=GitHub)](https://github.com/jokob-sk/Pi.Alert/actions/workflows/docker_prod.yml)
+[![Docker](https://img.shields.io/github/actions/workflow/status/jokob-sk/Pi.Alert/docker_prod.yml?label=Build&logo=GitHub)](https://github.com/jokob-sk/Pi.Alert/actions/workflows/docker_prod.yml)
 [![GitHub Committed](https://img.shields.io/github/last-commit/jokob-sk/Pi.Alert?color=40ba12&label=Committed&logo=GitHub&logoColor=fff)](https://github.com/jokob-sk/Pi.Alert)
 [![Docker Size](https://img.shields.io/docker/image-size/jokobsk/pi.alert?label=Size&logo=Docker&color=0aa8d2&logoColor=fff)](https://hub.docker.com/r/jokobsk/pi.alert)
 [![Docker Pulls](https://img.shields.io/docker/pulls/jokobsk/pi.alert?label=Pulls&logo=docker&color=0aa8d2&logoColor=fff)](https://hub.docker.com/r/jokobsk/pi.alert)
 [![Docker Pushed](https://img.shields.io/badge/dynamic/json?color=0aa8d2&logoColor=fff&label=Pushed&query=last_updated&url=https%3A%2F%2Fhub.docker.com%2Fv2%2Frepositories%2Fjokobsk%2Fpi.alert%2F&logo=docker&link=http://left&link=https://hub.docker.com/repository/docker/jokobsk/pi.alert)](https://hub.docker.com/r/jokobsk/pi.alert)
 
-🐳 [Docker hub](https://registry.hub.docker.com/r/jokobsk/pi.alert) | 📄 [Dockerfile](https://github.com/jokob-sk/Pi.Alert/blob/main/Dockerfile) | 📚 [Docker instructions](https://github.com/jokob-sk/Pi.Alert/blob/main//dockerfiles/README.md) | 🆕 [Release notes](https://github.com/jokob-sk/Pi.Alert/issues/138)
+🐳 [Docker hub](https://registry.hub.docker.com/r/jokobsk/pi.alert) | 📄 [Dockerfile](https://github.com/jokob-sk/Pi.Alert/blob/main/Dockerfile) | 📚 [Docker instructions](https://github.com/jokob-sk/Pi.Alert/blob/main/dockerfiles/README.md) | 🆕 [Release notes](https://github.com/jokob-sk/Pi.Alert/releases)
 
 ## 🔍 Scan Methods
 The system continuously scans the network for, **New devices**, **New connections** (re-connections), **Disconnections**, **"Always Connected" devices down**, Devices **IP changes** and **Internet IP address changes**. Scanning methods are:
@@ -30,67 +29,54 @@ The system continuously scans the network for, **New devices**, **New connection
         examines the DHCP leases (addresses assigned) to find active devices
         that were not discovered by the other methods.
 
-
-## 🧩 Notification Integrations 
+## 🧩 Integrations 
    - [Apprise](https://hub.docker.com/r/caronc/apprise), [Pushsafer](https://www.pushsafer.com/), [NTFY](https://ntfy.sh/)
    - [Webhooks](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/WEBHOOK_N8N.md) ([sample JSON](docs/webhook_json_sample.json))
-   - Home Assistant via [MQTT](https://www.home-assistant.io/integrations/mqtt/) 
-     - discovery ~10s per device, deleting not supported, use [MQTT Explorer](https://mqtt-explorer.com/) for now
-
-
-## 🔐 Security
-
-- Configurable login to prevent unauthorized use. 
-
-## 📑 Features   
-  - Display:
-    - Sessions, Connected devices, Favorites, Events, Presence, Concurrent devices, Down alerts, IP's
-    - Manual Nmap scans, Optional speedtest for Device "Internet"
-    - Simple Network relationship display
-  - Maintenance tasks and Settings like:
-    - Status Infos (active scans, database size, backup counter)
-    - Theme Selection (blue, red, green, yellow, black, purple) and Light/Dark-Mode Switch
-    - Language Selection (English, German, Spanish)    
-    - Pause arp-scan
-    - DB maintenance, Backup, Restore tools and CSV Export / Import
-  - Help/FAQ Section 
-
-  | ![Screen 1][screen1] | ![Screen 2][screen2] | 
-  |----------------------|----------------------| 
-  | ![Screen 3][screen3] | ![Screen 4][screen4] |
-  | ![Screen 5][screen5] | ![Screen 6][screen6] |
-  | ![Report 1][report1] | ![Report 2][report2] |
- 
+   - Home Assistant via [MQTT](https://www.home-assistant.io/integrations/mqtt/) - discovery ~10s per device, use [MQTT Explorer](https://mqtt-explorer.com/) to delete devices
+   - [API endpoint](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/API.md)
+   - [Plugin system](https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins) for custom script monitoring
 
 # 📥 Installation
 <!--- --------------------------------------------------------------------- --->
 
- ⚠ This [fork (jokob-sk)](https://github.com/jokob-sk/Pi.Alert) is only tested as a [docker container](dockerfiles/README.md). Check out [leiweibau's fork](https://github.com/leiweibau/Pi.Alert/) if you want to install Pi.Alert on the server directly.
+ ⚠ Only tested as a [docker container - follow these instructions here](dockerfiles/README.md). 
+ > Check out [leiweibau's fork](https://github.com/leiweibau/Pi.Alert/) if you want to install Pi.Alert on the server directly or original instructions for [pucherot's original code](https://github.com/pucherot/Pi.Alert/)
 
-Instructions for [pucherot's original code can be found here](https://github.com/pucherot/Pi.Alert/)
+# 📑 Features   
+  - Display:
+    - Sessions, Connected devices, Favorites, Events, Presence, Concurrent devices, Down alerts, IP's
+    - Manual Nmap scans, Optional speedtest for Device "Internet"
+    - Simple Network relationship display
+  - Maintenance tasks and Settings like:    
+    - Theme Selection (blue, red, green, yellow, black, purple) and Light/Dark-Mode Switch        
+    - DB maintenance, Backup, Restore tools and CSV Export / Import
+    - Simple login Support
+  - 🌟(Experimental) [Plugin system](https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins)
+    - Create custom plugins with automatically generated settings and UI. 
+    - Monitor anything for changes
+    - Check the [instructions](https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins) carefully if you are up for a challenge! Current plugins include:
+      - Detecting Rogue DHCP servers via NMAP
+      - Monitoring HTTP status changes of domains/URLs 
+      - Import devices from DHCP.leases files, a UniFi controller, or an SNMP enabled router
 
+  | ![Screen 1][screen1] | ![Screen 2][screen2] | ![Screen 5][screen5]  |
+  |----------------------|----------------------| ----------------------| 
+  | ![Screen 3][screen3] | ![Screen 4][screen4] | ![Screen 6][screen6]  |  
+  | ![Screen 8][screen8] | ![Report 2][report2] | ![Screen 9][screen9]  | 
+ 
 
-## 🔗 Other
-
-
-<!--- --------------------------------------------------------------------- --->
-
-<!--- --------------------------------------------------------------------- --->
-### Alternatives
+### 🔗 Other Alternatives
 
   - [WatchYourLAN](https://github.com/aceberg/WatchYourLAN) - Lightweight network IP scanner with web GUI (Open source)
   - [Fing](https://www.fing.com/) - Network scanner app for your Internet security (Commercial, Phone App, Proprietary hardware)
 
-### Old docs
+### 📚 Documentation
 
-  - [Device Management instructions](docs/DEVICE_MANAGEMENT.md)
-  - [Versions History](docs/VERSIONS_HISTORY.md)
+- Initial Docker Setup: [Docker instructions](https://github.com/jokob-sk/Pi.Alert/blob/main/dockerfiles/README.md)
+- App Usage and Configuration: [All Documentation](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/README.md)
 
 ### License
-  GPL 3.0
-  - [Read more here](LICENSE.txt)
-  - Source of the [animated GIF (Loading Animation)](https://commons.wikimedia.org/wiki/File:Loading_Animation.gif)  
-  - Source of the [selfhosted Fonts](https://github.com/adobe-fonts/source-sans)
+  GPL 3.0 | [Read more here](LICENSE.txt) | Source of the [animated GIF (Loading Animation)](https://commons.wikimedia.org/wiki/File:Loading_Animation.gif) | Source of the [selfhosted Fonts](https://github.com/adobe-fonts/source-sans)
   
 ### 🥇 Special thanks 
 
@@ -100,9 +86,16 @@ Instructions for [pucherot's original code can be found here](https://github.com
       - [leiweibau](https://github.com/leiweibau/Pi.Alert): Dark mode (and much more)
       - [Macleykun](https://github.com/Macleykun): Help with Dockerfile clean-up
       - [Final-Hawk](https://github.com/Final-Hawk): Help with NTFY, styling and other fixes
-      - [TeroRERO](https://github.com/terorero): Spanish translation
-      - [jokob-sk](https://github.com/jokob-sk/Pi.Alert): DB Maintenance tools
-      - Please see the [Git commit history](https://github.com/jokob-sk/Pi.Alert/commits/main) for a full list of people and their contributions to the project
+      - [TeroRERO](https://github.com/terorero): Spanish translation      
+      - Please see the [Git contributors](https://github.com/jokob-sk/Pi.Alert/graphs/contributors) for a full list of people and their contributions to the project
+
+## ☕ Support me
+
+<a href="https://github.com/sponsors/jokob-sk" target="_blank"><img src="https://i.imgur.com/X6p5ACK.png" alt="Sponsor Me on GitHub" style="height: 30px !important;width: 117px !important;" width="150px" ></a>
+<a href="https://www.buymeacoffee.com/jokobsk" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px !important;width: 117px !important;" width="117px" height="30px" ></a>
+<a href="https://www.patreon.com/user?u=84385063" target="_blank"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Patreon_logo_with_wordmark.svg/512px-Patreon_logo_with_wordmark.svg.png" alt="Support me on patreon" style="height: 30px !important;width: 117px !important;" width="117px" ></a>
+
+BTC: 1N8tupjeCK12qRVU2XrV17WvKK7LCawyZM
 
 <!--- --------------------------------------------------------------------- --->
 [main]:    ./docs/img/devices_split.png       "Main screen"
@@ -112,7 +105,9 @@ Instructions for [pucherot's original code can be found here](https://github.com
 [screen4]: ./docs/img/maintenance.png         "Screen 4"
 [screen5]: ./docs/img/network.png             "Screen 5"
 [screen6]: ./docs/img/settings.png            "Screen 6"
-[screen7]: ./docs/img/help_faq.png            "Screen 6"
+[screen7]: ./docs/img/help_faq.png            "Screen 7"
+[screen8]: ./docs/img/plugins_webmon.png      "Screen 8"
+[screen9]: ./docs/img/device_nmap.png         "Screen 9"
 [report1]: ./docs/img/4_report_1.jpg          "Report sample 1"
 [report2]: ./docs/img/4_report_2.jpg          "Report sample 2"
 [main_dark]: /docs/img/1_devices_dark.jpg     "Main screen dark"

back/report_sample.html

@@ -0,0 +1,173 @@
+<!-- ---------------------------------------------------------------------------
+   #  Pi.Alert
+   #  Open Source Network Guard / WIFI & LAN intrusion detector 
+   #
+   #  repot_template.html - Back module. Template to email reporting in HTML format
+   #-------------------------------------------------------------------------------
+   #  Puche 2021        pi.alert.application@gmail.com        GNU GPLv3
+   #--------------------------------------------------------------------------- -->
+   <html>
+    <head></head>
+    <body>
+       <font face=sans-serif>
+          <table align=center width=100% cellpadding=0 cellspacing=0 style="border-radius: 5px;">
+             <tr>
+                <td bgcolor=#EFB956  align=center style="padding: 20px 10px 10px 10px; font-size: 30px; font-weight: bold; color:#000000; border-top-right-radius: 5px; border-top-left-radius: 5px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
+                   Pi.Alert Report
+                </td>
+             </tr>
+             <tr>
+                <td bgcolor=#2656f1 width=100% align=center style="padding: 20px 10px 10px 10px; font-size: 20px; font-weight: bold; color:#ffffff; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
+                   <a style="color:#ffffff;cursor:pointer;" href="https://github.com/jokob-sk/Pi.Alert/releases">🆕 New version available 🆕</a>
+                </td>
+             </tr>
+             <tr>
+                <td>
+                   <table width=100% border=0 bgcolor=#FFD966 cellpadding=5px cellspacing=0 style="border-collapse: collapse; font-size: 15px; text-align:center; color:#404040">
+                      <tr>
+                         <td width=100%> Report Date: <b>2023-01-30 22:17</b> </td>
+                      </tr>
+                   </table>
+                </td>
+             </tr>
+             <tr>
+                <td bgcolor=#F5F5F5 height=200 valign=top style="padding: 10px">
+                   <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                      <tr>
+                         <th width='120px' style='color:blue; font-size: 12px;' bgcolor='#909090'  >New devices</th>
+                      </tr>
+                      <tr>
+                         <td>
+                            <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                               <tr>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >MAC</th>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Datetime</th>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >IP</th>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Event Type</th>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Device name</th>
+                                  <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Comments</th>
+                               </tr>
+                               <tr>
+                                  <td><a href="http://192.168.1.1:20211/deviceDetails.php?mac=00:00:00:ef:a5:6c">00:00:00:ef:a5:6c</a></td>
+                                  <td>2023-01-30 22:15:09</td>
+                                  <td>192.168.1.1</td>
+                                  <td>New Device</td>
+                                  <td>(name not found)</td>
+                                  <td></td>
+                               </tr>
+                               <tr>
+                                  <td><a href="http://192.168.1.1:20211/deviceDetails.php?mac=00:00:00:ef:a5:6c">00:00:00:ef:a5:6c</a></td>
+                                  <td>2023-01-30 22:17:59</td>
+                                  <td>192.168.1.82</td>
+                                  <td>New Device</td>
+                                  <td>(name not found)</td>
+                                  <td></td>
+                               </tr>
+                            </table>
+                         </td>
+                      </tr>
+                   </table>
+                   <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                      <tr>
+                         <th width='120px' style='color:blue; font-size: 12px;' bgcolor='#909090'  >Events</th>
+                      </tr>
+                      <tr>
+                         <td>
+                            <ul>
+                               <li>
+                                  <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                                     <tr>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >MAC</th>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Datetime</th>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >IP</th>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Event Type</th>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Device name</th>
+                                        <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Comments</th>
+                                     </tr>
+                                     <tr>
+                                        <td><a href="http://192.168.1.1:20211/deviceDetails.php?mac=00:00:00:ef:a5:6c">00:00:00:ef:a5:6c</a></td>
+                                        <td>2023-01-30 22:15:09</td>
+                                        <td>192.168.1.92</td>
+                                        <td>Disconnected</td>
+                                        <td>(name not found)</td>
+                                        <td></td>
+                                     </tr>
+                                  </table>
+                               </li>
+                            </ul>
+                         </td>
+                      </tr>
+                   </table>
+                   <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                      <tr>
+                         <th width='120px' style='color:blue; font-size: 12px;' bgcolor='#909090'  >Changed or new ports</th>
+                      </tr>
+                      <tr>
+                         <td>
+                            <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                               <tr>
+                                  <th>new</th>
+                               </tr>                              
+                               <tr>
+                                  <td>
+                                     <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                                        <tr>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Name</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >MAC</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Port</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >State</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Service</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Extra</th>
+                                        </tr>
+                                        <tr>
+                                           <td>New device</td>
+                                           <td><a href="http://192.168.1.1:20211/deviceDetails.php?mac=00:00:00:ef:a5:6c">00:00:00:ef:a5:6c</a></td>
+                                           <td>3263/tcp</td>
+                                           <td>open</td>
+                                           <td>ecolor-imager</td>
+                                           <td></td>
+                                        </tr>
+                                     </table>
+                                  </td>
+                               </tr>
+                               <tr>
+                                  <td>
+                                     <table style="border-collapse: collapse; font-size: 12px; color:#70707" width="100%" cellspacing="0" cellpadding="3px" bordercolor="#C0C0C0" border="1">
+                                        <tr>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Name</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >MAC</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Port</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >State</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Service</th>
+                                           <th width='120px' style='color:#F0F0F0' bgcolor='#909090'  >Extra</th>
+                                        </tr>
+                                        <tr>
+                                           <td>New device</td>
+                                           <td><a href="http://192.168.1.1:20211/deviceDetails.php?mac=00:00:00:ef:a5:6c">00:00:00:ef:a5:6c</a></td>
+                                           <td>3264/tcp</td>
+                                           <td>open</td>
+                                           <td>ccmail</td>
+                                           <td></td>
+                                        </tr>
+                                     </table>
+                                  </td>
+                               </tr>
+                               
+                            </table>
+                         </td>
+                      </tr>
+                   </table>
+             <tr>
+                <td>
+                   <table width=100% bgcolor=#46802e cellpadding=5px cellspacing=0 style="font-size: 13px; font-weight: bold; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;">
+                      <tr>
+                         <td width=50% style="text-align:center"> Pi.Alert - Synology-NAS</td>
+                      </tr>
+                   </table>
+                </td>
+             </tr>
+          </table>
+       </font>
+    </body>
+ </html>
+ 

back/report_sample_2.html

@@ -1,143 +0,0 @@
-<!-- ---------------------------------------------------------------------------
-#  Pi.Alert
-#  Open Source Network Guard / WIFI & LAN intrusion detector 
-#
-#  repot_sample.html - Back module. Sample email reporting in HTML format
-#-------------------------------------------------------------------------------
-#  Puche 2021        pi.alert.application@gmail.com        GNU GPLv3
-#--------------------------------------------------------------------------- -->
-
-<html>
-
-<head>
-</head>
-
-<body>
-    <font face=sans-serif>
-    <table align=center width=80% border=1 bordercolor=#909090 cellpadding=0 cellspacing=0 style="border-collapse: collapse; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.5)">
-        <tr>
-        <td bgcolor=#EFB956  align=center style="padding: 20px 10px 10px 10px; font-size: 36px; font-weight: bold; color:#7F6000; text-shadow: 4px 4px 6px #909090">
-            Pi.Alert Report
-        </td>
-        </tr>
-
-        <tr>
-        <td>
-            <table width=100% border=0 bgcolor=#FFD966 cellpadding=5px cellspacing=0 style="border-collapse: collapse; font-size: 16px; text-align:center; color:#5F5000">
-            <tr>
-                <td width=33%> Report Date: <b>2021-01-01 08:00</b> </td>
-                <td width=34%> Scan Cycle: <b>1</b> </td>
-                <td width=33%> Server: <b>pi4</b> </td>
-            </tr>
-            </table>
-        </td>
-        </tr>
-
-
-
-        <tr>
-        <td bgcolor=#F5F5F5 height=400 valign=top style="padding: 20px">
-            
-
-            
-            <p style="font-size: 14px; font-weight: bold; color:#C04040; text-shadow: 2px 2px 4px #A0A0A0"> New Devices: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Vendor </th>
-                </tr>
-
-                <tr>
-  <td> f8:d0:27:00:00:00 </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td> 192.168.1.20 </td>
-  <td> Seiko Epson Corporation </td>
-</tr>
-<tr>
-  <td> c8:6c:3d:00:00:00 </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td> 192.168.1.181 </td>
-  <td> Amazon Technologies Inc. </td>
-</tr>
-
-            </table>
-
-            <br>
-            
-
-            
-            <p style="font-size: 14px; font-weight: bold; color:#C04040; text-shadow: 2px 2px 4px #A0A0A0"> Devices Down: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Device Name </th>
-                </tr>
-
-<tr>
-  <td> 0c:ee:99:00:00:00 </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td> 192.168.1.171 </td>
-  <td> Alexa - Echo </td>
-</tr>
-
-            </table>
-
-            <br>
-            
-
-            
-            <p style="font-size: 14px; font-weight: bold; color:#409040; text-shadow: 2px 2px 4px #A0A0A0"> Events: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th width=100> Event Type </th>
-                    <th width=140> Device Name </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <tr>
-  <td> 94:0c:98:00:00:00 </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td> 192.168.1.132 </td>
-  <td> Connected </td>
-  <td> Person 1 - iPhone 11 </td>
-  <td>  </td>
-</tr>
-<tr>
-  <td> 5c:41:5a:00:00:00 </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td> 192.168.1.170 </td>
-  <td> IP Changed </td>
-  <td> Alexa Dot </td>
-  <td> Previous IP: 192.168.1.243 </td>
-</tr>
-
-            </table>
-            
-        </td>
-        </tr>
-        
-        <tr>
-        <td>
-            <table width=100% border=0 bgcolor=#70AD47 cellpadding=5px cellspacing=0 style="border-collapse: collapse; font-size: 12px; font-weight: bold; color:#385723">
-               <tr>
-                    <td width=25% style="text-align:Left">   Puche 2021</td>
-                    <td width=50% style="text-align:center"> Pi.Alert 2.50 &nbsp; / &nbsp; 2021-01-01  </td>
-                    <td width=25% style="text-align:right">  GNU GPLv3</td>
-                </tr>
-            </table>
-        </td>
-        </tr>
-    </table>
-    </font>
-</body>
-</html>

back/report_template.html

@@ -32,74 +32,13 @@
 
         <tr>
         <td bgcolor=#F5F5F5 height=200 valign=top style="padding: 10px">
-            <SECTION_INTERNET>
-            <p style="font-size: 24px; font-weight: bold; color:#C04040"> Internet: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#f0f0f0">
-                    <th width=140> Event Type </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <TABLE_INTERNET>
-            </table>
-
-            <br>
-            </SECTION_INTERNET>
-
-            <SECTION_NEW_DEVICES>
-            <p style="font-size: 14px; font-weight: bold; color:#C04040"> New Devices: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=150> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th width=140> Device Name </th>
-                    <th> Vendor </th>
-                </tr>
-
-                <TABLE_NEW_DEVICES>
-            </table>
-
-            <br>
-            </SECTION_NEW_DEVICES>
-
-            <SECTION_DEVICES_DOWN>
-            <p style="font-size: 14px; font-weight: bold; color:#C04040"> Devices Down: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Device Name </th>
-                </tr>
-
-                <TABLE_DEVICES_DOWN>
-            </table>
-
-            <br>
-            </SECTION_DEVICES_DOWN>
-
-            <SECTION_EVENTS>
-            <p style="font-size: 14px; font-weight: bold; color:#409040"> Events: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th width=100> Event Type </th>
-                    <th width=140> Device Name </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <TABLE_EVENTS>
-            </table>
-            </SECTION_EVENTS>
+            
+                <INTERNET_TABLE>
+                <NEW_DEVICES_TABLE>            
+                <DOWN_DEVICES_TABLE>            
+                <EVENTS_TABLE>            
+                <PORTS_TABLE>
+                <PLUGINS_TABLE>
         </td>
         </tr>
         

back/report_template.txt

@@ -1,19 +1,9 @@
 Report Date: <REPORT_DATE>
 Server:      <SERVER_NAME>
+
 <SECTION_NEW_DEVICES>
-New Devices
-----------------------
-<TABLE_NEW_DEVICES>
-</SECTION_NEW_DEVICES><SECTION_DEVICES_DOWN>
-Devices Down
-----------------------
-<TABLE_DEVICES_DOWN>
-</SECTION_DEVICES_DOWN><SECTION_EVENTS>
-Events
-----------------------
-<TABLE_EVENTS>
-</SECTION_EVENTS><SECTION_INTERNET>
-Internet
-----------------------
-<TABLE_INTERNET>
-</SECTION_INTERNET>
+<SECTION_DEVICES_DOWN>
+<SECTION_EVENTS>
+<SECTION_INTERNET>
+<PORTS_TABLE>
+<PLUGINS_TABLE>

back/report_template_new_version.html

@@ -21,9 +21,9 @@
         </td>
         </tr>
         <tr> 
-            <a style="color:#ffffff" href="https://github.com/jokob-sk/Pi.Alert/releases">
-                <td bgcolor=#2656f1 width=100% align=center style="padding: 20px 10px 10px 10px; font-size: 20px; font-weight: bold; color:#ffffff; border-top-right-radius: 5px; border-top-left-radius: 5px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">🆕 New version available 🆕</td> 
-            </a>
+            <td bgcolor=#2656f1 width=100% align=center style="padding: 20px 10px 10px 10px; font-size: 20px; font-weight: bold; color:#ffffff; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
+                <a style="color:#ffffff;cursor:pointer;" href="https://github.com/jokob-sk/Pi.Alert/releases">🆕 New version available 🆕</a>
+            </td>             
         </tr>
         <tr>
         <td>
@@ -36,76 +36,13 @@
 
         <tr>
         <td bgcolor=#F5F5F5 height=200 valign=top style="padding: 10px">
-            <SECTION_INTERNET>
-            <p style="font-size: 24px; font-weight: bold; color:#C04040"> Internet: </p> 
 
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#f0f0f0">
-                    <th width=140> Event Type </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <TABLE_INTERNET>
-            </table>
-
-            <br>
-            </SECTION_INTERNET>
-
-            <SECTION_NEW_DEVICES>
-            <p style="font-size: 14px; font-weight: bold; color:#C04040"> New Devices: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=150> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th width=140> Device Name </th>
-                    <th> Vendor </th>
-                </tr>
-
-                <TABLE_NEW_DEVICES>
-            </table>
-
-            <br>
-            </SECTION_NEW_DEVICES>
-
-            <SECTION_DEVICES_DOWN>
-            <p style="font-size: 14px; font-weight: bold; color:#C04040"> Devices Down: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Device Name </th>
-                </tr>
-
-                <TABLE_DEVICES_DOWN>
-            </table>
-
-            <br>
-            </SECTION_DEVICES_DOWN>
-
-            <SECTION_EVENTS>
-            <p style="font-size: 14px; font-weight: bold; color:#409040"> Events: </p> 
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> MAC </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th width=100> Event Type </th>
-                    <th width=140> Device Name </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <TABLE_EVENTS>
-            </table>
-            </SECTION_EVENTS>
-        </td>
-        </tr>
+            <INTERNET_TABLE>
+            <NEW_DEVICES_TABLE>            
+            <DOWN_DEVICES_TABLE>            
+            <EVENTS_TABLE>            
+            <PORTS_TABLE>
+            <PLUGINS_TABLE>
         
         <tr>
         <td>
@@ -118,5 +55,7 @@
         </tr>
     </table>
     </font>
+
+
 </body>
 </html>

back/update_vendors.sh

@@ -26,16 +26,16 @@ sudo cp *.csv 2_backup
 echo ""
 echo Download Start
 echo ""
-sudo curl $1  -O https://standards-oui.ieee.org/iab/iab.csv \
-              -O https://standards-oui.ieee.org/iab/iab.txt \
-              -O https://standards-oui.ieee.org/oui28/mam.csv \
-              -O https://standards-oui.ieee.org/iab/iab.txt \
-              -O https://standards-oui.ieee.org/oui28/mam.csv \
-              -O https://standards-oui.ieee.org/oui28/mam.txt \
-              -O https://standards-oui.ieee.org/oui36/oui36.csv \
-              -O https://standards-oui.ieee.org/oui36/oui36.txt \
-              -O https://standards-oui.ieee.org/oui/oui.csv \
-              -O https://standards-oui.ieee.org/oui/oui.txt
+sudo curl $1  -LO https://standards-oui.ieee.org/iab/iab.csv \
+              -LO https://standards-oui.ieee.org/iab/iab.txt \
+              -LO https://standards-oui.ieee.org/oui28/mam.csv \
+              -LO https://standards-oui.ieee.org/iab/iab.txt \
+              -LO https://standards-oui.ieee.org/oui28/mam.csv \
+              -LO https://standards-oui.ieee.org/oui28/mam.txt \
+              -LO https://standards-oui.ieee.org/oui36/oui36.csv \
+              -LO https://standards-oui.ieee.org/oui36/oui36.txt \
+              -LO https://standards-oui.ieee.org/oui/oui.csv \
+              -LO https://standards-oui.ieee.org/oui/oui.txt
 echo ""
 echo Download Finished
 

back/webhook_json_sample.json

@@ -17,197 +17,68 @@
                     "title": "Pi.Alert Notifications",
                     "title_link": "",
                     "text": {
-                        "internet": [
-                            [
-                              "Internet",
-                              "243.243.243.243",
-                              "2022-01-06 18:32:03",
-                              "Internet IP Changed",
-                              "Previous Internet IP: 0.0.0.0",
-                              1,
-                              null
-                            ],
-                            [
-                              "Internet",
-                              "243.243.243.243",
-                              "2022-01-06 18:32:03",
-                              "New Device",
-                              null,
-                              1,
-                              null
-                            ]
-                          ],
-                        "new_devices": [
-                            [
-                              "b8:b8:b8:b8:b8:b8",
-                              "192.168.1.19",
-                              "2023-01-06 18:32:03",
-                              "New Device",
-                              "Raspberry Pi Foundation",
-                              1,
-                              null,
-                              "b8:b8:b8:b8:b8:b8",
-                              "raspberrypi",
-                              "(unknown)",
-                              null,
-                              "Raspberry Pi Foundation",
-                              0,
-                              null,
-                              null,
-                              "2021-01-06 18:32:03",
-                              "2021-01-06 18:32:03",
-                              "192.168.1.19",
-                              0,
-                              1,
-                              1,
-                              1,
-                              0,
-                              0,
-                              null,
-                              1,
-                              1,
-                              null,
-                              0,
-                              null,
-                              null
-                            ],
-                            [
-                              "b1:b8:b8:b8:b8:b8",
-                              "192.168.1.45",
-                              "2021-01-06 18:32:03",
-                              "New Device",
-                              "EliteGroup Computer Systems Co., LTD",
-                              1,
-                              null,
-                              "b1:b8:b8:b8:b8:b8",
-                              "my-NUC",
-                              "(unknown)",
-                              null,
-                              "EliteGroup Computer Systems Co., LTD",
-                              0,
-                              null,
-                              null,
-                              "2023-01-06 18:32:03",
-                              "2023-01-06 18:32:03",
-                              "192.168.1.45",
-                              0,
-                              1,
-                              1,
-                              1,
-                              0,
-                              0,
-                              null,
-                              1,
-                              1,
-                              null,
-                              0,
-                              null,
-                              null
-                            ]
-                          ],
-                        "down_devices": [
-                            [
-                              "aa:77:aa:77:aa:77",
-                              "192.168.1.151",
-                              "2021-01-07 14:20:53",
-                              "Device Down",
-                              "",
-                              1,
-                              25,
-                              "aa:77:aa:77:aa:77",
-                              "ttgo_tdisplay_weather",
-                              "(unknown)",
-                              "",
-                              "Espressif Inc.",
-                              0,
-                              "",
-                              "",
-                              "2021-01-06 23:13:06",
-                              "2021-01-06 23:13:06",
-                              "192.168.1.151",
-                              0,
-                              1,
-                              1,
-                              0,
-                              1,
-                              0,
-                              "2021-01-06 23:34:37.067330",
-                              0,
-                              0,
-                              "",
-                              0,
-                              "",
-                              ""
-                            ]
-                          ],
-                        "events": [
-                            [
-                                "aa:77:aa:77:aa:77",
-                                "192.168.1.151",
-                                "2022-08-12 21:48:00",
-                                "Connected",
-                                "",
-                                1,
-                                null,
-                                "aa:77:aa:77:aa:77",
-                                "ESP32 - display",
-                                "House",
-                                "",
-                                "Espressif Inc.",
-                                0,
-                                "",
-                                "",
-                                "2022-07-21 20:35:00",
-                                "2022-08-12 21:48:00",
-                                "192.168.1.151",
-                                0,
-                                1,
-                                1,
-                                1,
-                                0,
-                                0,
-                                "2022-08-12 21:42:47.937413",
-                                1,
-                                0,
-                                "",
-                                0,
-                                "aa:77:aa:77:aa:77",
-                                ""
-                            ],
-                            [
-                                "aa:77:aa:77:aa:77",
-                                "192.168.1.149",
-                                "2022-08-12 21:48:00",
-                                "Connected",
-                                "",
-                                1,
-                                null,
-                                "aa:77:aa:77:aa:77",
-                                "ESP32 - 1",
-                                "House",
-                                "Singleboard Computer (SBC)",
-                                "Espressif Inc.",
-                                0,
-                                "",
-                                "",
-                                "2022-07-15 05:30:00",
-                                "2022-08-12 21:48:00",
-                                "192.168.1.149",
-                                0,
-                                1,
-                                1,
-                                1,
-                                0,
-                                0,
-                                "2022-08-12 21:42:47.937413",
-                                1,
-                                1,
-                                "",
-                                0,
-                                "aa:77:aa:77:aa:77",
-                                ""
-                            ]
-                        ]
+                      "internet": [],
+                      "new_devices": [{
+                        "MAC": "74:ac:74:ac:74:ac",
+                        "Datetime": "2023-01-30 22:15:09",
+                        "IP": "192.168.1.1",
+                        "Event Type": "New Device",
+                        "Device name": "(name not found)",
+                        "Comments": null
+                      }],
+                      "down_devices": [],
+                      "events": [{
+                        "MAC": "74:ac:74:ac:74:ac",
+                        "Datetime": "2023-01-30 22:15:09",
+                        "IP": "192.168.1.92",
+                        "Event Type": "Disconnected",
+                        "Device name": "(name not found)",
+                        "Comments": null
+                      }, {
+                        "MAC": "74:ac:74:ac:74:ac",
+                        "Datetime": "2023-01-30 22:15:09",
+                        "IP": "192.168.1.150",
+                        "Event Type": "Disconnected",
+                        "Device name": "(name not found)",
+                        "Comments": null
+                      }],
+                      "ports": [{
+                        "new": {
+                          "Name": "New device",
+                          "MAC": "74:ac:74:ac:74:ac",
+                          "Port": "22/tcp",
+                          "State": "open",
+                          "Service": "ssh",
+                          "Extra": ""
+                        }
+                      }, {
+                        "new": {
+                          "Name": "New device",
+                          "MAC": "74:ac:74:ac:74:ac",
+                          "Port": "53/tcp",
+                          "State": "open",
+                          "Service": "domain",
+                          "Extra": ""
+                        }
+                      }, {
+                        "new": {
+                          "Name": "New device",
+                          "MAC": "74:ac:74:ac:74:ac",
+                          "Port": "80/tcp",
+                          "State": "open",
+                          "Service": "http",
+                          "Extra": ""
+                        }
+                      }, {
+                        "new": {
+                          "Name": "New device",
+                          "MAC": "74:ac:74:ac:74:ac",
+                          "Port": "443/tcp",
+                          "State": "open",
+                          "Service": "https",
+                          "Extra": ""
+                        }
+                      }]
                     }
                 }
             ]

config/pialert.conf

@@ -23,7 +23,8 @@ PIALERT_WEB_PASSWORD='8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923a
 INCLUDED_SECTIONS=['internet','new_devices','down_devices','events']
 SCAN_CYCLE_MINUTES=5
 DAYS_TO_KEEP_EVENTS=90
-REPORT_DASHBOARD_URL='http://pi.alert/'
+# Used for generating links in emails. Make sure not to add a trailing slash!
+REPORT_DASHBOARD_URL='http://pi.alert'
 
 
 # Email
@@ -103,7 +104,7 @@ DHCP_ACTIVE=False
 # Pholus
 #---------------------------
 PHOLUS_ACTIVE=False
-PHOLUS_TIMEOUT=20
+PHOLUS_TIMEOUT=120
 PHOLUS_FORCE=False
 PHOLUS_DAYS_DATA=7
 PHOLUS_RUN='once'

docker-compose.yml

@@ -7,19 +7,22 @@ services:
     network_mode: "host"
     restart: unless-stopped
     volumes:
-      - ${APP_DATA_LOCATION}/pialert/config:/home/pi/pialert/config
+      - ${APP_DATA_LOCATION}/pialert2/config:/home/pi/pialert/config
       # - ${APP_DATA_LOCATION}/pialert/db/pialert.db:/home/pi/pialert/db/pialert.db
-      - ${APP_DATA_LOCATION}/pialert/db:/home/pi/pialert/db
-      # (optional) map an empty file with the name 'setting_darkmode' if you want to force the dark mode on container rebuilt
-      - ${APP_DATA_LOCATION}/pialert/db/setting_darkmode:/home/pi/pialert/db/setting_darkmode
+      - ${APP_DATA_LOCATION}/pialert2/db:/home/pi/pialert/db      
       # (optional) useful for debugging if you have issues setting up the container
-      - ${LOGS_LOCATION}:/home/pi/pialert/front/log
+      - ${LOGS_LOCATION}:/home/pi/pialert/front/log      
       # DELETE START anyone trying to use this file: comment out / delete BELOW lines, they are only for development purposes
+      - ${APP_DATA_LOCATION}/pialert/dhcp_samples/dhcp1.leases:/mnt/dhcp1.leases
+      - ${APP_DATA_LOCATION}/pialert/dhcp_samples/dhcp2.leases:/mnt/dhcp2.leases
       - ${DEV_LOCATION}/back/pialert.py:/home/pi/pialert/back/pialert.py
-      - ${DEV_LOCATION}/back/update_vendors.sh:/home/pi/pialert/back/update_vendors.sh
+      - ${DEV_LOCATION}/back/report_template.html:/home/pi/pialert/back/report_template.html
+      - ${DEV_LOCATION}/back/report_template_new_version.html:/home/pi/pialert/back/report_template_new_version.html
+      - ${DEV_LOCATION}/back/report_template.txt:/home/pi/pialert/back/report_template.txt
       - ${DEV_LOCATION}/pholus:/home/pi/pialert/pholus
       - ${DEV_LOCATION}/dockerfiles:/home/pi/pialert/dockerfiles
       - ${APP_DATA_LOCATION}/pialert/php.ini:/etc/php/7.4/fpm/php.ini      
+      # - ${DEV_LOCATION}/front/api:/home/pi/pialert/front/api
       - ${DEV_LOCATION}/front/css:/home/pi/pialert/front/css
       - ${DEV_LOCATION}/front/lib/AdminLTE:/home/pi/pialert/front/lib/AdminLTE
       - ${DEV_LOCATION}/front/js:/home/pi/pialert/front/js
@@ -27,12 +30,14 @@ services:
       - ${DEV_LOCATION}/front/deviceDetails.php:/home/pi/pialert/front/deviceDetails.php
       - ${DEV_LOCATION}/front/devices.php:/home/pi/pialert/front/devices.php
       - ${DEV_LOCATION}/front/events.php:/home/pi/pialert/front/events.php
+      - ${DEV_LOCATION}/front/plugins.php:/home/pi/pialert/front/plugins.php
       - ${DEV_LOCATION}/front/help_faq.php:/home/pi/pialert/front/help_faq.php
       - ${DEV_LOCATION}/front/index.php:/home/pi/pialert/front/index.php
       - ${DEV_LOCATION}/front/maintenance.php:/home/pi/pialert/front/maintenance.php
       - ${DEV_LOCATION}/front/network.php:/home/pi/pialert/front/network.php
       - ${DEV_LOCATION}/front/presence.php:/home/pi/pialert/front/presence.php
       - ${DEV_LOCATION}/front/settings.php:/home/pi/pialert/front/settings.php
+      - ${DEV_LOCATION}/front/plugins:/home/pi/pialert/front/plugins
       # DELETE END anyone trying to use this file: comment out / delete ABOVE lines, they are only for development purposes
     environment:
       - TZ=${TZ}

dockerfiles/README.md

@@ -1,4 +1,4 @@
-[![Docker](https://img.shields.io/github/actions/workflow/status/jokob-sk/Pi.Alert/docker_prod.yml?branch=main&label=Build&logo=GitHub)](https://github.com/jokob-sk/Pi.Alert/actions/workflows/docker_prod.yml)
+[![Docker](https://img.shields.io/github/actions/workflow/status/jokob-sk/Pi.Alert/docker_prod.yml?label=Build&logo=GitHub)](https://github.com/jokob-sk/Pi.Alert/actions/workflows/docker_prod.yml)
 [![GitHub Committed](https://img.shields.io/github/last-commit/jokob-sk/Pi.Alert?color=40ba12&label=Committed&logo=GitHub&logoColor=fff)](https://github.com/jokob-sk/Pi.Alert)
 [![Docker Size](https://img.shields.io/docker/image-size/jokobsk/pi.alert?label=Size&logo=Docker&color=0aa8d2&logoColor=fff)](https://hub.docker.com/r/jokobsk/pi.alert)
 [![Docker Pulls](https://img.shields.io/docker/pulls/jokobsk/pi.alert?label=Pulls&logo=docker&color=0aa8d2&logoColor=fff)](https://hub.docker.com/r/jokobsk/pi.alert)
@@ -6,7 +6,7 @@
 
 # 🐳 A docker image for Pi.Alert 
 
-🐳 [Docker hub](https://registry.hub.docker.com/r/jokobsk/pi.alert) | 📄 [Dockerfile](https://github.com/jokob-sk/Pi.Alert/blob/main/Dockerfile) | 📚 [Docker instructions](https://github.com/jokob-sk/Pi.Alert/blob/main//dockerfiles/README.md) | 🆕 [Release notes](https://github.com/jokob-sk/Pi.Alert/issues/138)
+🐳 [Docker hub](https://registry.hub.docker.com/r/jokobsk/pi.alert) | 📄 [Dockerfile](https://github.com/jokob-sk/Pi.Alert/blob/main/Dockerfile) | 📚 [Docker instructions](https://github.com/jokob-sk/Pi.Alert/blob/main/dockerfiles/README.md) | 🆕 [Release notes](https://github.com/jokob-sk/Pi.Alert/releases)
 
 <a href="https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/devices_split.png" target="_blank">
   <img src="https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/devices_split.png" width="300px" />
@@ -45,34 +45,47 @@ docker run -d --rm --network=host \
 | :------------- | :------------- |:-------------| 
 | **Required** | `:/home/pi/pialert/config` | Folder which will contain the `pialert.conf` file (see below for details)  | 
 | **Required** | `:/home/pi/pialert/db` | Folder which will contain the `pialert.db` file  | 
-|Optional| `:/home/pi/pialert/db/setting_darkmode` |  Map an empty file with the name `setting_darkmode` if you want to force the dark mode on container rebuilt  | 
 |Optional| `:/home/pi/pialert/front/log` |  Logs folder useful for debugging if you have issues setting up the container  | 
 |Optional| `:/etc/pihole/pihole-FTL.db` |  PiHole's `pihole-FTL.db` database file. Required if you want to use PiHole  | 
 |Optional| `:/etc/pihole/dhcp.leases` |  PiHole's `dhcp.leases` file. Required if you want to use PiHole  | 
+|Optional| `:/home/pi/pialert/front/api` |  A simple [API endpoint](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/API.md) containing static (but regularly updated) json and other files.   | 
 
 
 ### Config (`pialert.conf`)
 
-- Modify [pialert.conf](https://github.com/jokob-sk/Pi.Alert/tree/main/config) or manage the configuration via Settings.  
-- ❗ Set the `SCAN_SUBNETS` variable. 
+- If unavailable, the app generates a default `pialert.conf` and `pialert.db` file on the first run.
+- The preferred way is to manage the configuration via the Settings section in the UI.
+- You can modify [pialert.conf](https://github.com/jokob-sk/Pi.Alert/tree/main/config) directly, if needed.
+
+#### Important settings
+
+These are the most important settings to get at least some output in your Devices screen. Usually, only one approach is used, but you should be able to combine these approaches.
+
+##### For arp-scan: ENABLE_ARPSCAN, SCAN_SUBNETS
+
+- ❗ To use the arp-scan method, you need to set the `SCAN_SUBNETS` variable.
    * The adapter will probably be `eth0` or `eth1`. (Run `iwconfig` to find your interface name(s)) 
    * Specify the network filter (which **significantly** speeds up the scan process). For example, the filter `192.168.1.0/24` covers IP ranges 192.168.1.0 to 192.168.1.255.
-   * Examples for one and two subnets  (❗ Note the `['...', '...']` format for two or more subnets):
+   * Examples for one and two subnets  (❗ Note the `['...', '...']` format):
      * One subnet: `SCAN_SUBNETS    = ['192.168.1.0/24 --interface=eth0']`
-     * Two subnets:  `SCAN_SUBNETS    = ['192.168.1.0/24 --interface=eth0', '192.168.1.0/24 --interface=eth1']` 
+     * Two subnets:  `SCAN_SUBNETS    = ['192.168.1.0/24 --interface=eth0', '192.168.1.0/24 --interface=eth1 -vlan=107']` 
+   * More documentation on how to e.g. [setup vlans & limitations](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/SUBNETS.md) 
 
+##### For pihole: PIHOLE_ACTIVE, DHCP_ACTIVE
 
-### 🛑 **Common issues** 
+* `PIHOLE_ACTIVE`: You need to map `:/etc/pihole/pihole-FTL.db in the docker-compose.yml` file if you enable this setting.
+* `DHCP_ACTIVE` : You need to map `:/etc/pihole/dhcp.leases in the docker-compose.yml` file if you enable this setting.
+
+### **Common issues** 
 
 💡 Before creating a new issue, please check if a similar issue was [already resolved](https://github.com/jokob-sk/Pi.Alert/issues?q=is%3Aissue+is%3Aclosed). 
 
 **Permissions**
 
 * If facing issues (AJAX errors, can't write to DB, empty screen, etc,) make sure permissions are set correctly, and check the logs under `/home/pi/pialert/front/log`. 
-* To solve permission issues you can also try to create a DB backup and then run a DB Restore via the **Maintenance > Backup/Restore** section.
-* You can try also setting the owner and group of the `pialert.db` by executing the following on the host system: `docker exec pialert chown -R www-data:www-data /home/pi/pialert/db/pialert.db`. 
+* To solve permission issues you can try setting the owner and group of the `pialert.db` by executing the following on the host system: `docker exec pialert chown -R www-data:www-data /home/pi/pialert/db/pialert.db`. 
 * Map to local User and Group IDs. Specify the enviroment variables `HOST_USER_ID` and `HOST_USER_GID` if needed.
-* Map the pialert.db file (⚠ not folder) to `:/home/pi/pialert/db/pialert.db` (see Examples below for details)
+* If still facing issues, try to map the pialert.db file (⚠ not folder) to `:/home/pi/pialert/db/pialert.db` (see Examples below for details)
 
 **Container restarts / crashes**
 
@@ -99,9 +112,7 @@ services:
     restart: unless-stopped
     volumes:
       - local/path/pialert/config:/home/pi/pialert/config
-      - local/path/pialert/db:/home/pi/pialert/db
-      # (optional) map an empty file with the name 'setting_darkmode' if you want to force the dark mode on container rebuilt
-      - local/path/pialert/db/setting_darkmode:/home/pi/pialert/db/setting_darkmode
+      - local/path/pialert/db:/home/pi/pialert/db      
       # (optional) useful for debugging if you have issues setting up the container
       - local/path/logs:/home/pi/pialert/front/log
     environment:
@@ -115,6 +126,27 @@ To run the container execute: `sudo docker-compose up -d`
 
 ### Example 2
 
+Example by [SeimuS](https://github.com/SeimusS).
+
+```yaml
+  pialert:
+    container_name: PiAlert
+    hostname: PiAlert
+    privileged: true
+    image: jokobsk/pi.alert:latest
+    environment:
+      - TZ=Europe/Bratislava
+    restart: always
+    volumes:
+      - ./pialert/pialert_db:/home/pi/pialert/db
+      - ./pialert/pialert_config:/home/pi/pialert/config
+    network_mode: host
+```
+
+To run the container execute: `sudo docker-compose up -d`
+
+### Example 3
+
 `docker-compose.yml` 
 
 ```yaml
@@ -127,9 +159,7 @@ services:
     restart: unless-stopped
     volumes:
       - ${APP_DATA_LOCATION}/pialert/config:/home/pi/pialert/config
-      - ${APP_DATA_LOCATION}/pialert/db/pialert.db:/home/pi/pialert/db/pialert.db
-      # (optional) map an empty file with the name 'setting_darkmode' if you want to force the dark mode on container rebuilt
-      - ${APP_DATA_LOCATION}/pialert/db/setting_darkmode:/home/pi/pialert/db/setting_darkmode
+      - ${APP_DATA_LOCATION}/pialert/db/pialert.db:/home/pi/pialert/db/pialert.db      
       # (optional) useful for debugging if you have issues setting up the container
       - ${LOGS_LOCATION}:/home/pi/pialert/front/log
     environment:
@@ -162,7 +192,7 @@ DEV_LOCATION=/path/to/local/source/code
 
 To run the container execute: `sudo docker-compose --env-file /path/to/.env up`
 
-### Example 3
+### Example 4
 
 Courtesy of [pbek](https://github.com/pbek). The volume `pialert_db` is used by the db directory. The two config files are mounted directly from a local folder to their places in the config folder. You can backup the `docker-compose.yaml` folder and the docker volumes folder.
 
@@ -192,8 +222,8 @@ Big thanks to <a href="https://github.com/Macleykun">@Macleykun</a> for help and
 
 ## ☕ Support me
 
-Disclaimer: Please only donate if you don't have any debt yourself. Support yourself first, then others.
-
 <a href="https://github.com/sponsors/jokob-sk" target="_blank"><img src="https://i.imgur.com/X6p5ACK.png" alt="Sponsor Me on GitHub" style="height: 30px !important;width: 117px !important;" width="150px" ></a>
 <a href="https://www.buymeacoffee.com/jokobsk" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-yellow.png" alt="Buy Me A Coffee" style="height: 30px !important;width: 117px !important;" width="117px" height="30px" ></a>
 <a href="https://www.patreon.com/user?u=84385063" target="_blank"><img src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/82/Patreon_logo_with_wordmark.svg/512px-Patreon_logo_with_wordmark.svg.png" alt="Support me on patreon" style="height: 30px !important;width: 117px !important;" width="117px" ></a>
+
+BTC: 1N8tupjeCK12qRVU2XrV17WvKK7LCawyZM

docs/API.md

@@ -0,0 +1,98 @@
+## API endpoints
+
+PiAlert comes with a simple API. These API endpoints are static files, that are periodically updated based on your settings. 
+
+
+### When are the endpoints updated
+
+Once you enable the API (`ENABLE_API` setting), the endpoints are updated when objects in the API endpoints are changed:
+
+### Location of the endpoints
+
+In the container, these files are located under the `/home/pi/pialert/front/api/` folder and thus on the `<pialert_url>/api/<File name>` url.
+
+### Available endpoints
+
+You can access the following files:
+
+  | File name | Description | 
+  |----------------------|----------------------| 
+  | `notification_text.txt` | The plain text version of the last notification. |
+  | `notification_text.html` | The full HTML of the last email notification. |
+  | `notification_json_final.json` | The json version of the last notification (e.g. used for webhooks - [sample JSON](https://github.com/jokob-sk/Pi.Alert/blob/main/back/webhook_json_sample.json)). |
+  | `table_devices.json` | The current (at the time of the last update as mentioned above on this page) state of all of the available Devices detected by the app. |
+  | `table_nmap_scan.json` | The current state of the discovered ports by the regular NMAP scans. |
+  | `table_pholus_scan.json` | The latest state of the [pholus](https://github.com/jokob-sk/Pi.Alert/tree/main/pholus) (A multicast DNS and DNS Service Discovery Security Assessment Tool) scan results. |
+  | `table_plugins_events.json` | The list of the unprocessed (pending) notification events (plugins_events DB table). |
+  | `table_plugins_history.json` | The list of notification events history. |  
+  | `table_plugins_objects.json` | The content of the plugins_objects table. Find more info on the [Plugin system here](https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins)|
+  | `language_strings.json` | The content of the language_strings table, which in turn is loaded from the plugins `config.json` definitions. |  
+  | `table_custom_endpoint.json` | A custom endpoint generated by the SQL query specified by the `API_CUSTOM_SQL` setting. |
+  | `table_settings.json` | The content of the settings table. |
+  
+  Current/latest state of the aforementioned files depends on your settings.
+
+### JSON Data format
+
+The endpoints starting with the `table_` prefix contain most, if not all, data contained in the corresponding database table. The common format for those is:
+
+```JSON
+{
+  "data": [
+        {
+          "db_column_name": "data",
+          "db_column_name2": "data2"      
+        }, 
+        {
+          "db_column_name": "data3",
+          "db_column_name2": "data4" 
+        }
+    ]
+}
+
+```
+
+Example JSON of the `table_devices.json` endpoint with two Devices (database rows):
+
+```JSON
+{
+  "data": [
+        {
+          "dev_MAC": "Internet",
+          "dev_Name": "Net - Huawei",
+          "dev_DeviceType": "Router",
+          "dev_Vendor": null,
+          "dev_Group": "Always on",
+          "dev_FirstConnection": "2021-01-01 00:00:00",
+          "dev_LastConnection": "2021-01-28 22:22:11",
+          "dev_LastIP": "192.168.1.24",
+          "dev_StaticIP": 0,
+          "dev_PresentLastScan": 1,
+          "dev_LastNotification": "2023-01-28 22:22:28.998715",
+          "dev_NewDevice": 0,
+          "dev_Network_Node_MAC_ADDR": "",
+          "dev_Network_Node_port": "",
+          "dev_Icon": "globe"
+        }, 
+        {
+          "dev_MAC": "a4:8f:ff:aa:ba:1f",
+          "dev_Name": "Net - USG",
+          "dev_DeviceType": "Firewall",
+          "dev_Vendor": "Ubiquiti Inc",
+          "dev_Group": "",
+          "dev_FirstConnection": "2021-02-12 22:05:00",
+          "dev_LastConnection": "2021-07-17 15:40:00",
+          "dev_LastIP": "192.168.1.1",
+          "dev_StaticIP": 1,
+          "dev_PresentLastScan": 1,
+          "dev_LastNotification": "2021-07-17 15:40:10.667717",
+          "dev_NewDevice": 0,
+          "dev_Network_Node_MAC_ADDR": "Internet",
+          "dev_Network_Node_port": 1,
+          "dev_Icon": "shield-halved"
+      }
+    ]
+}
+
+```
+

docs/DEBUG_INVALID_JSON.md

@@ -0,0 +1,31 @@
+# How to debug the Invalid JSON response error
+
+Check the the HTTP response of the failing backend call by following these steps:
+
+- Open developer console in your browser (usually, e. g. for Chrome, key F12 on the keyboard).
+- Follow the steps in this screenshot: 
+
+![F12DeveloperConsole][F12DeveloperConsole]
+
+- Copy the URL causing the error and enter it in the address bar of your browser directly and hit enter. The copied URLs could look something like this (notice the query strings at the end):
+  - `http://<pialert URL>:20211/php/server/devices.php?action=getDevicesTotals`
+  - `http://<pialert URL>:20211/php/server/devices.php?action=getDevicesList&status=all`
+
+- Post the error response in the existing issue thread on GitHub or create a new issue and include the redacted response of the failing query.
+
+For reference, the above queries should return results in the following format:
+
+First URL:
+
+![array][array]
+
+Second URL:
+
+![json][json]
+
+You can copy and paste any JSON result (result of the second query) into an online JSON checker, such as [this one](https://jsonchecker.com/) to check if it's valid.
+
+
+[F12DeveloperConsole]:    ./img/DEBUG/Invalid_JSON_repsonse_debug.png           "F12DeveloperConsole"
+[array]:                  ./img/DEBUG/array_result_example.png                  "array"
+[json]:                   ./img/DEBUG/JSON_result_example.png                   "json"

docs/DEVICE_MANAGEMENT.md

@@ -18,7 +18,7 @@ To edit device information:
   - **Owner**: Device owner (The list is self-populated with existing owners)
   - **Type**: Select a device type from the dropdown list (Smartphone, Table,
       Laptop, TV, router, ....) or type a new device type
-  - **Vendor**: Automatically updated by Pi.Alert
+  - **Vendor**: Automatically updated by Pi.Alert when empty or unknown
   - **Favorite**: Mark the device as favorite and then it will appears at the
       begining of the device list
   - **Group**: Select a grouper ('Always on', 'Personal', Friends') or type

docs/ICONS.md

@@ -0,0 +1,20 @@
+## Icons overview
+
+Icons are used to visually distinguish devices in the app in most of the device listing tables and the [network tree](/docs/NETWORK_TREE.md). Currently only free [Font Awesome](https://fontawesome.com/search?o=r&m=free) icons (up-to v 6.4.0) are supported (I have an unblockable [sponsorship goal](https://github.com/sponsors/jokob-sk) to add the material design icon pack).  
+
+![Raspberry Pi with a brand icon](/docs/img/ICONS/devices-icons.png)
+
+## ⚙ How to use custom device Icons
+
+You can assign icons individually on each device in the Details tab.
+
+![Raspberry Pi device details](/docs/img/ICONS/device-icon.png)
+
+- You can click into the `Icon` field or click the Pencil (2) icon in the above screenshot to enter any text. Only [free Font Awesome](https://fontawesome.com/search?o=r&m=free) icons in the following format will work:
+
+  1. For any value that is only prefixed with `fa-`, you can enter the value directly, such as `server`, `tv`, `ethernet`. 
+  2. If you want to add another classname, e.g. `fa-brands`, you can enter `brands fa-[fontawesome-icon-name]`, so for `apple` that is using the syntax`fa-brands fa-apple`, you would enter `brands fa-apple`.
+
+- If you want to mass-apply an icon to all devices of the same device type (Field marked (4) in the above screenshot), you can click the copy button (Marked (1) in the above screenshot). A confirmation prompt is displayed. If you proceed, icons of all devices set to the same device type as the current device, will be overwritten with the current device's icon.
+
+- The dropdown (3) contains all icons already used in the app for device icons. You need to navigate away or refresh the page once you add a new icon. 

docs/NETWORK_TREE.md

@@ -0,0 +1,54 @@
+## How to setup 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).
+
+## ⚡Quick setup:
+
+* Go to Devices > Device Details. 
+* Find the device(s) you want to use as network devices (network nodes). 
+* 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.
+* 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 correct network node.
+
+
+## 🔍Detailed example:
+
+In this example you will setup a device named `rapberrypi` as a `Switch` in our network. 
+
+### 1) Device details page
+
+- Go to the `Devices` (1) page:
+
+![Device details](/docs/img/NETWORK_TREE/Device_Details_Network_Type.png)
+
+- In the (2) `Details` tab navigate to the the `Type` (3) dropdown and select the type `Switch` (4).
+
+> Note: Only the following device types will show up as selectable Network nodes ( = devices you can connect other devices to):
+> AP, Firewall, Gateway, PLC, Powerline, Router, Switch, USB LAN Adapter, USB WIFI Adapter and WLAN.
+
+- 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). 
+
+- Save your changes (7)
+
+### 1) Network page
+
+- Navigate to your `Network` (1) page:
+
+![Network page](/docs/img/NETWORK_TREE/Network_Page.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
+
+### 1) Network page with 2 levels
+
+- After clicking the `Assign` button in the previous section, the `(AppleTV)` (1) device is now connected to our `raspberrypi` (2).
+
+![Network page with 2 levels](/docs/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.
+
+
+

docs/README.md

@@ -0,0 +1,91 @@
+## Documentation overview
+
+In the app hover-over settings or fields/labels or click blue in-app ❔ (question-mark) icons to get to relevant documentation pages.
+
+![In-app help](/docs/img/GENERAL/in-app-help.png)
+
+There is also an in-app Help / FAQ section that should be answering frequently asked questions.
+
+### 📥 Installation
+
+ ⚠ Only tested as a [docker container - follow these instructions here](https://github.com/jokob-sk/Pi.Alert/blob/main/dockerfiles/README.md). 
+ > Check out [leiweibau's fork](https://github.com/leiweibau/Pi.Alert/) if you want to install Pi.Alert on the server directly or original instructions for [pucherot's original code](https://github.com/pucherot/Pi.Alert/)
+
+
+### 📚 Table of contents
+
+#### Popular/Suggested
+
+- [API endpoints details](/docs/API.md)
+- [Plugin system details and how to develop your own](/front/plugins/README.md)
+- [Network tree map configuration](/docs/NETWORK_TREE.md)
+- [Gmail as SMTP server for sending emails](/docs/SMTP_GMAIL.md)
+- [Subnets and vlans configuration for arp-scan](/docs/SUBNETS.md)
+
+#### System Management
+
+- [Manage devices (legacy docs)](/docs/DEVICE_MANAGEMENT.md)
+- [Random MAC/MAC icon meaning (legacy docs)](/docs/RANDOM_MAC.md)
+- [Custom Icons configuration and support](/docs/ICONS.md)
+
+#### Examples
+
+- [N8N webhook example](/docs/WEBHOOK_N8N.md)
+
+#### Misc
+
+- [New Version notifications](/docs/VERSIONS.md)
+- [Version history (legacy)](/docs/VERSIONS_HISTORY.md)
+- [Invalid JSON errors debug help](/docs/DEBUG_INVALID_JSON.md)
+
+Feel free to suggest or submit new docs via a PR. 
+
+## 👨‍💻 Development priorities
+
+Highest to lowest:
+
+* Fixing core functionality bugs not solvable with workarounds
+* New core functionality unlocking other opportunities (e.g.: plugins) 
+* Refactoring enabling faster implementation of future functionality 
+* UI improvements
+
+Design philosophy: Focus on core functionality and leverage existing apps and tools to make PiAlert integratable into other workflows. 
+
+Examples: 
+
+    1. Supporting apprise makes more sense than implementing multiple individual notification gateways
+    2. Implementing regular expressions support across settings for validation makes more sense than validating one setting with a specific expression. 
+
+UI specific requests are low priority as the framework picked by the original developer is not very extensible (and afaik doesn't support components) and has limited mobile support. Also I argue the value proposition is smaller than working on something else.
+
+Feel free to submit PRs if interested. try to **keep the PRs small/on topic** so they are easier to review and approve. 
+
+That being said, I'd reconsider if more people and or recurring sponsors file a request 😉.
+
+## 🙏 Feature requests
+
+Please be as detailed as possible with **workarounds** you considered and why a native feature is the better way. This gives me better context and will make it more likely to be implemented. Ideally a feature request should be in the format "I want to be able to do XYZ so that ZYX. I considered these approaches XYZ".
+
+## ➕ Pull-requests (PRs)
+
+If you submit a PR please:
+
+1. Check that your changes are backward compatible with existing installations and with a blank setup. 
+2. Existing features should always be preserved. 
+3. Keep the PR small, on-topic and don't change code that is not necessary for the PR to work
+4. New features code should ideally be re-usable for different purposes, not be for a very narrow use-case.
+5. New functionality should ideally be implemented via the Plugins system, if possible.
+
+Soem additional context:
+
+* Permanent settings/config is stored in the `pialert.conf` file
+* Currently temporary (session?) settings are stored in the `Parameters` DB table as key - value pairs. This table is wiped during a container rebuild/restart and it's values re-initialized from cookies / session data from the browser. 
+
+## 🐛 Submitting an issue or bug
+
+Before submitting a new issue please spend a couple of minutes on research:
+
+* Check [🛑 Common issues](https://github.com/jokob-sk/Pi.Alert/tree/main/dockerfiles#-common-issues) 
+* Check [💡 Closed issues](https://github.com/jokob-sk/Pi.Alert/issues?q=is%3Aissue+is%3Aclosed) if a similar issue was solved in the past.
+
+⚠ Please follow the pre-defined issue template to resolve your issue faster.

docs/SMTP_GMAIL.md

@@ -0,0 +1,15 @@
+## Use the Gmail SMTP server
+    
+1) Create an app password by following the instructions from Google, you need to Enable 2FA for this to work.
+[https://support.google.com/accounts/answer/185833](https://support.google.com/accounts/answer/185833)
+
+2) Specify the following settings:
+
+```python
+    SMTP_SKIP_TLS=True
+    SMTP_FORCE_SSL=True 
+    SMTP_PORT=465
+    SMTP_SERVER='smtp.gmail.com'
+    SMTP_PASS='16-digit passcode from google'
+```
+

docs/SUBNETS.md

@@ -0,0 +1,21 @@
+## Subnets configuration
+
+The arp-scan time itself depends on the number of IP addresses to check. 
+The number of IPs to check depends on the [network mask](https://www.calculator.net/ip-subnet-calculator.html) you set on the `SCAN_SUBNETS` setting. 
+
+For example, a `/24` mask results in 256 IPs to check, where as a `/16` mask checks around 65,536. Every IP takes a couple seconds. This means that with an incorrect configuration the arp-scan will take hours to complete instead of seconds.
+
+- Specify the network mask. For example, the filter `192.168.1.0/24` covers IP ranges 192.168.1.0 to 192.168.1.255
+- Run `iwconfig` in your container to find your interface name(s) (e.g.: `eth0`, `eth1`). 
+- Append e.g.: ` -vlan=107` to the interface field (e.g.: `eth0 -vlan=107`) for multiple vlans. More details in this [comment in this issue](https://github.com/jokob-sk/Pi.Alert/issues/170#issuecomment-1419902988)
+
+### 🔍Example:
+
+![Vlan configuration example](/docs/img/SUBNETS/subnets_vlan.png)
+
+### Support for VLANS
+
+Please note about the accessibility of the macvlans when they are configured on the same computer. My understanding this is a general networking behavior, but feel free to clarify via a PR/issue.
+
+- Pi.Alert does not detect the macvlan container when it is running on the same computer.
+- Pi.Alert recognizes the macvlan container when it is running on a different computer.

docs/VERSIONS.md

@@ -0,0 +1,25 @@
+## Am I running the latest released version?
+
+Since version 23.01.14 PiAlert uses a simple timestamp-based version check to verify if a new version is available. You can check the [current and past releases here](https://github.com/jokob-sk/Pi.Alert/releases), or have a look at what I'm [currently working on](https://github.com/jokob-sk/Pi.Alert/issues/138). 
+
+If you are not on the latest version, the app will notify you, that a new released version is avialable the following way:
+
+### 📧 Via email on a notification event
+
+If any notification occurs and an email is sent, the email will contain a note that a new version is available. See the sample email below:
+
+![Sample email if a new version is available](/docs/img/VERSIONS/new-version-available-email.png)
+
+### 🆕 In the UI
+
+In the UI via a notification Icon and via a custom message in the Maintenance section.
+
+![UI screenshot if a new version is available](/docs/img/VERSIONS/new-version-available-maintenance.png)
+
+For a comparison, this is how the UI looks like if you are on the latest stable image:
+
+![UI screenshot if on latest version](/docs/img/VERSIONS/latest-version-maintenance.png)
+
+## Implementation details
+
+During build a [/home/pi/pialert/front/buildtimestamp.txt](https://github.com/jokob-sk/Pi.Alert/blob/092797e75ccfa8359444ad149e727358ac4da05f/Dockerfile#L44) file is created. The app then periodically checks if a new release is available with a newer timestamp in GitHub's rest-based JSON endpoint (check the `def isNewVersion():` method in `pialert.py` for details).   

docs/WEBHOOK_N8N.md

@@ -1,12 +1,18 @@
 ### Create a simple n8n workflow
-![n8n workflow](https://i.imgur.com/2EGrQjt.png)
+
+![n8n workflow](/docs/img/WEBHOOK_N8N/n8n_workflow.png)
 
 ### Specify your email template 
 See [sample JSON](https://github.com/jokob-sk/Pi.Alert/blob/main/back/webhook_json_sample.json) if you want to see the JSON paths used in the email template below
-![Email template](https://i.imgur.com/kcVjGm1.png)
+![Email template](/docs/img/WEBHOOK_N8N/n8n_send_email_settings.png)
+
+```
+Events count: {{ $json["body"]["attachments"][0]["text"]["events"].length }}
+New devices count: {{ $json["body"]["attachments"][0]["text"]["new_devices"].length }}
+```
 
 ### Get your webhook in n8n
-![n8n webhook URL](https://i.imgur.com/clN8eE5.png)
+![n8n webhook URL](/docs/img/WEBHOOK_N8N/n8n_webhook_settings.png)
 
 ### Configure PiAlert to point to the above URL
-![PiAlert config](https://i.imgur.com/rowJCC7.png)
+![PiAlert config](/docs/img/WEBHOOK_N8N/Webhook_settings.png)

docs/report_sample_1.html

@@ -1,80 +0,0 @@
-<!-- ---------------------------------------------------------------------------
-#  Pi.Alert
-#  Open Source Network Guard / WIFI & LAN intrusion detector 
-#
-#  repot_sample.html - Back module. Sample email reporting in HTML format
-#-------------------------------------------------------------------------------
-#  Puche 2021        pi.alert.application@gmail.com        GNU GPLv3
-#--------------------------------------------------------------------------- -->
-
-<html>
-
-<head>
-</head>
-
-<body>
-    <font face=sans-serif>
-    <table align=center width=80% border=1 bordercolor=#909090 cellpadding=0 cellspacing=0 style="border-collapse: collapse; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.5)">
-        <tr>
-        <td bgcolor=#EFB956  align=center style="padding: 20px 10px 10px 10px; font-size: 36px; font-weight: bold; color:#7F6000; text-shadow: 4px 4px 6px #909090">
-            Pi.Alert Report
-        </td>
-        </tr>
-
-        <tr>
-        <td>
-            <table width=100% border=0 bgcolor=#FFD966 cellpadding=5px cellspacing=0 style="border-collapse: collapse; font-size: 16px; text-align:center; color:#5F5000">
-            <tr>
-                <td width=33%> Report Date: <b>2021-01-01 08:00</b> </td>
-                <td width=34%> Scan Cycle: <b>Internet</b> </td>
-                <td width=33%> Server: <b>pi4</b> </td>
-            </tr>
-            </table>
-        </td>
-        </tr>
-
-        <tr>
-        <td bgcolor=#F5F5F5 valign=top height=400 style="padding: 20px">
-
-            <p style="font-size: 24px; font-weight: bold; color:#C04040; text-shadow: 2px 2px 4px #A0A0A0"> Internet: </p>
-
-            <table width=100% border=1 bordercolor=#C0C0C0 cellpadding=3px cellspacing=0 style="border-collapse: collapse; font-size: 12px; color:#707070; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2)">
-                <tr bgcolor=#909090 style="color:#F0F0F0">
-                    <th width=140> Event Type </th>
-                    <th width=130> Datetime </th>
-                    <th width=100> IP </th>
-                    <th> Additional Info </th>
-                </tr>
-
-                <tr>
-  <td> Internet IP Changed </td>
-  <td> 2021-01-01 08:00:00 </td>
-  <td style="font-size: 24px; color:#D02020"> 1.1.1.0 </td>
-  <td> Previous Internet IP: 1.1.0.0 </td>
-</tr>
-
-            </table>
-
-            <br>
-
-        </td>
-        </tr>
-
-
-
-
-        <tr>
-        <td>
-            <table width=100% border=0 bgcolor=#70AD47 cellpadding=5px cellspacing=0 style="border-collapse: collapse; font-size: 12px; font-weight: bold; color:#385723">
-               <tr>
-                    <td width=25% style="text-align:Left">   Puche 2021</td>
-                    <td width=50% style="text-align:center"> Pi.Alert 2.50 &nbsp; / &nbsp; 2021-01-01  </td>
-                    <td width=25% style="text-align:right">  GNU GPLv3</td>
-                </tr>
-            </table>
-        </td>
-        </tr>
-    </table>
-    </font>
-</body>
-</html>

front/api/.gitignore

@@ -0,0 +1,2 @@
+*
+!.gitignore

front/css/pialert.css

@@ -591,7 +591,14 @@ height: 50px;
 }
 
 .nav-tabs-custom .tab-content {
-  background-color: white;
+  background-color: white;  
+  
+}
+
+@media (max-width: 767px) {
+    .nav-tabs-custom .tab-content {          
+        overflow: scroll;
+      }
 }
 
 .top_small_box_gray_text {
@@ -623,20 +630,21 @@ height: 50px;
         width:30%;         
     }
   }
-  @media (min-width: 768px) {
-    .setting_description {        
-        /* color: green; */
-        display: block;
-    }
-    .setting_input{
-        width:35%;        
-        /* background-color: green; */
-    }
-    .setting_name
-    {
-        width:19%;         
-    }
-  }
+
+@media (min-width: 768px) {
+.setting_description {        
+    /* color: green; */
+    display: block;
+}
+.setting_input{
+    width:40%;        
+    /* background-color: green; */
+}
+.setting_name
+{
+    width:19%;         
+}
+}
 
 .table_row {    
     padding: 3px;    
@@ -663,7 +671,7 @@ height: 50px;
 
 .setting_description
 {
-    width:46%;
+    width:40%;
 }
 
 .myhidden
@@ -691,6 +699,9 @@ height: 50px;
     margin: 10px;
     
 }
+#settingsPage .panel-heading:hover{    
+    background-color: #272c30;
+}
 
 .settings-expand-icon {
     font-size: medium;
@@ -723,4 +734,108 @@ height: 50px;
 .pointer
 {
     cursor:pointer;
+}
+.db_info_table_row .select2-container--default .select2-selection--multiple .select2-selection__choice
+{
+    background-color:#258744;
+}
+.db_info_table_row .select2-container--default .select2-selection--multiple
+{
+    background-color:#606060;
+}
+
+.select2-container .select2-dropdown
+{
+    background-color:#606060;
+}
+
+.networkPageHelp{
+    position: absolute;
+    font-size: x-small;
+    margin-bottom: 6px;
+}
+
+.pageHelp{
+    position: absolute;
+    font-size: x-small;
+    margin-bottom: 6px;
+}
+
+
+#networkTree .box
+{
+    padding:2px;
+    margin:2px;
+}
+#networkTree .netNodeText
+{
+    top: 2px;
+    margin: 2px;    
+    position: absolute;
+}
+#networkTree
+{
+    margin-left: 16px;
+    /* border: solid;
+    border-color:#606060;     */
+    position: relative;
+    font-size: 0.75em;
+}
+#networkTree .netIcon
+{
+    width: 25px;;
+    float:left;
+    display:inline;    
+}
+#networkTree .netCollapse
+{
+    display: block;
+    position: absolute;
+    margin-left: 156px;
+    top: -3px;
+    font-size: large;
+    left: -15px;
+}
+#networkTree .highlightedNode
+{
+    border: solid;
+    border-color:cyan;
+}
+#networkTree .netStatus-Off-line i
+{
+    color: #dd4b39;
+}
+
+.spanNetworkTree {
+    display: inline-block;
+    width: 120px;
+    white-space: nowrap;
+    overflow: hidden !important;
+    text-overflow: ellipsis;
+}
+
+.plugin-content
+{
+    padding-bottom: 7px;
+}
+.plugin-content #tabs-content-location
+{
+    margin-top: 20px;
+    margin-left: 7px;
+    margin-right: 7px;
+    margin-bottom: 9px;
+    padding-bottom: 8px;
+}
+
+.plugins-description
+{
+    padding-top: 20px;
+}
+
+
+  
+.login-page .login-custom
+{
+    width:480px;
+    
 }

front/devices.php

@@ -11,7 +11,6 @@
 
   require 'php/templates/header.php';
   require 'php/templates/graph.php';
-  require 'php/server/util.php';
   
 
   // check permissions
@@ -27,7 +26,7 @@
 <!-- Content header--------------------------------------------------------- -->
     <section class="content-header">
       <h1 id="pageTitle">
-           <?php echo lang('Device_Title');?>
+           <?= lang('Device_Title');?>
       </h1>
     </section>
 
@@ -40,7 +39,7 @@
           <a href="#" onclick="javascript: getDevicesList('all');">
           <div class="small-box bg-aqua">
             <div class="inner"><h3 id="devicesAll"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_AllDevices');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_AllDevices');?></p>
             </div>
             <div class="icon"><i class="fa fa-laptop text-aqua-40"></i></div>
           </div>
@@ -52,7 +51,7 @@
           <a href="#" onclick="javascript: getDevicesList('connected');">
           <div class="small-box bg-green">
             <div class="inner"><h3 id="devicesConnected"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_Connected');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_Connected');?></p>
             </div>
             <div class="icon"><i class="fa fa-plug text-green-40"></i></div>
           </div>
@@ -64,7 +63,7 @@
           <a href="#" onclick="javascript: getDevicesList('favorites');">
           <div class="small-box bg-yellow">
             <div class="inner"><h3 id="devicesFavorites"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_Favorites');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_Favorites');?></p>
             </div>
             <div class="icon"><i class="fa fa-star text-yellow-40"></i></div>
           </div>
@@ -76,7 +75,7 @@
           <a href="#" onclick="javascript: getDevicesList('new');">
           <div class="small-box bg-yellow">
             <div class="inner"><h3 id="devicesNew"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_NewDevices');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_NewDevices');?></p>
             </div>
             <div class="icon"><i class="ion ion-plus-round text-yellow-40"></i></div>
           </div>
@@ -88,7 +87,7 @@
           <a href="#" onclick="javascript: getDevicesList('down');">
           <div class="small-box bg-red">
             <div class="inner"><h3 id="devicesDown"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_DownAlerts');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_DownAlerts');?></p>
             </div>
             <div class="icon"><i class="fa fa-warning text-red-40"></i></div>
           </div>
@@ -100,7 +99,7 @@
           <a href="#" onclick="javascript: getDevicesList('archived');">
           <div class="small-box bg-gray top_small_box_gray_text">
             <div class="inner"><h3 id="devicesArchived"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Device_Shortcut_Archived');?></p>
+                <p class="infobox_label"><?= lang('Device_Shortcut_Archived');?></p>
             </div>
             <div class="icon"><i class="fa fa-eye-slash text-gray-40"></i></div>
           </div>
@@ -115,7 +114,7 @@
           <div class="col-md-12">
           <div class="box" id="clients">
               <div class="box-header with-border">
-                <h3 class="box-title"><?php echo lang('Device_Shortcut_OnlineChart');?> </h3>
+                <h3 class="box-title"><?= lang('Device_Shortcut_OnlineChart');?> </h3>
               </div>
               <div class="box-body">
                 <div class="chart">
@@ -150,20 +149,8 @@
             <div class="box-body table-responsive">
               <table id="tableDevices" class="table table-bordered table-hover table-striped">
                 <thead>
-                <tr>
-                  <th><?php echo lang('Device_TableHead_Name');?></th>
-                  <th><?php echo lang('Device_TableHead_Owner');?></th>
-                  <th><?php echo lang('Device_TableHead_Type');?></th>
-                  <th><?php echo lang('Device_TableHead_Favorite');?></th>
-                  <th><?php echo lang('Device_TableHead_Group');?></th>
-                  <th><?php echo lang('Device_TableHead_FirstSession');?></th>
-                  <th><?php echo lang('Device_TableHead_LastSession');?></th>
-                  <th><?php echo lang('Device_TableHead_LastIP');?></th>
-                  <th><?php echo lang('Device_TableHead_MAC');?></th>
-                  <th><?php echo lang('Device_TableHead_Status');?></th>
-                  <th><?php echo lang('Device_TableHead_MAC');?></th>
-                  <th><?php echo lang('Device_TableHead_LastIPOrder');?></th>
-                  <th><?php echo lang('Device_TableHead_Rowid');?></th>
+                <tr>                
+                  
                 </tr>
                 </thead>
               </table>
@@ -204,6 +191,10 @@
   var parTableOrder   = 'Front_Devices_Order';
   var tableRows       = 10;
   var tableOrder      = [[3,'desc'], [0,'asc']];
+  
+  var columnsStr = '[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17]';
+  var tableColumnOrder = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17] ; 
+  var tableColumnVisible = tableColumnOrder;
 
   // Read parameters & Initialize components
   main();
@@ -211,48 +202,134 @@
 
 // -----------------------------------------------------------------------------
 function main () {
-  
-  // get parameter value
-  $.get('php/server/parameters.php?action=get&parameter='+ parTableRows, function(data) {
-    var result = JSON.parse(data);
 
-    result = parseInt(result, 10)
+  // get from cookie if available (need to use decodeURI as saved as part of URI in PHP)
+  cookieColumnsVisibleStr = decodeURI(getCookie("Front_Devices_Columns_Visible")).replaceAll('%2C',',')  
 
-    if (Number.isInteger (result) ) {
-        tableRows = result;  
-    }
+  defaultValue = cookieColumnsVisibleStr == "" ? columnsStr : cookieColumnsVisibleStr;
 
-    // get parameter value
-    $.get('php/server/parameters.php?action=get&parameter='+ parTableOrder, function(data) {
-      var result = JSON.parse(data);
-      result = JSON.parse(result);
-      if (Array.isArray (result) ) {
-        tableOrder = result;
+  // get visible columns
+  $.get('php/server/parameters.php?action=get&expireMinutes=525600&defaultValue='+defaultValue+'&parameter=Front_Devices_Columns_Visible&skipcache', function(data) {
+    
+    // save which columns are in the Devices page visible
+    tableColumnVisible = numberArrayFromString(data);
+
+    // get from cookie if available (need to use decodeURI as saved as part of URI in PHP)
+    cookieColumnsOrderStr = decodeURI(getCookie("Front_Devices_Columns_Order")).replaceAll('%2C',',')
+
+    defaultValue = cookieColumnsOrderStr == "" ? columnsStr : cookieColumnsOrderStr;    
+
+    // get the custom order specified by the user
+    $.get('php/server/parameters.php?action=get&expireMinutes=525600&defaultValue='+defaultValue+'&parameter=Front_Devices_Columns_Order&skipcache', function(data) {
+    
+      // save the columns order in the Devices page 
+      tableColumnOrder = numberArrayFromString(data);
+
+
+
+      //initialize the table headers in the correct order
+      var headersDefaultOrder = [ '<?= lang('Device_TableHead_Name');?>',
+                                  '<?= lang('Device_TableHead_Owner');?>',
+                                  '<?= lang('Device_TableHead_Type');?>',       
+                                  '<?= lang('Device_TableHead_Icon');?>',
+                                  '<?= lang('Device_TableHead_Favorite');?>',
+                                  '<?= lang('Device_TableHead_Group');?>',
+                                  '<?= lang('Device_TableHead_FirstSession');?>',
+                                  '<?= lang('Device_TableHead_LastSession');?>',
+                                  '<?= lang('Device_TableHead_LastIP');?>',
+                                  '<?= lang('Device_TableHead_MAC');?>',
+                                  '<?= lang('Device_TableHead_Status');?>',
+                                  '<?= lang('Device_TableHead_MAC_full');?>',
+                                  '<?= lang('Device_TableHead_LastIPOrder');?>',
+                                  '<?= lang('Device_TableHead_Rowid');?>',
+                                  '<?= lang('Device_TableHead_Parent_MAC');?>',
+                                  '<?= lang('Device_TableHead_Connected_Devices');?>',
+                                  '<?= lang('Device_TableHead_Location');?>',
+                                  '<?= lang('Device_TableHead_Vendor');?>'
+                                ];
+
+      html = '';
+                                  
+      for(index = 0; index < tableColumnOrder.length; index++)
+      {
+        html += '<th>' + headersDefaultOrder[tableColumnOrder[index]] + '</th>';
       }
 
-      // Initialize components with parameters
-      initializeDatatable();
+      $('#tableDevices tr').html(html);   
 
-      // query data
-      getDevicesTotals();
-      getDevicesList (deviceStatus);
-     });
+      // get parameter value
+      $.get('php/server/parameters.php?action=get&defaultValue=50&parameter='+ parTableRows, function(data) {
+        var result = JSON.parse(data);
+
+        result = parseInt(result, 10)
+
+        if (Number.isInteger (result) ) {
+            tableRows = result;  
+        }
+
+        // get parameter value
+        $.get('php/server/parameters.php?action=get&defaultValue=[[3,"desc"],[0,"asc"]]&parameter='+ parTableOrder, function(data) {
+          var result = JSON.parse(data);
+          result = JSON.parse(result);
+
+          
+
+          if (Array.isArray (result) ) {
+            tableOrder = result;
+          }
+
+          // Initialize components with parameters
+          initializeDatatable();
+
+          // query data
+          getDevicesTotals();
+          getDevicesList (deviceStatus);
+        });
+      });
+    });
    });
 }
 
 // -----------------------------------------------------------------------------
+var tableColumnHide = [];
+
+// mapping the default order to the user specified one
+function mapIndx(oldIndex)
+{
+  for(i=0;i<tableColumnOrder.length;i++)
+  {
+    if(tableColumnOrder[i] == oldIndex)
+    {
+      return i;
+    }
+  }
+}
+
+// -----------------------------------------------------------------------------
+
 function initializeDatatable () {
+  for(i = 0; i < tableColumnOrder.length; i++)
+  {    
+    // hide this column if not in the tableColumnVisible variable (we need to keep the MAC address (index 11) for functionality reasons)    
+    if(tableColumnVisible.includes(tableColumnOrder[i]) == false)
+    {
+      tableColumnHide.push(mapIndx(tableColumnOrder[i]));
+    }    
+  }
+
   // If the device has a small width (mobile) only show name, ip, and status columns. 
-  if (window.screen.width < 400) {
-    var tableColumnShow = [10,11,12,1,2,3,4,5,6,8];
-  } else {
-    var tableColumnShow = [10, 11, 12];
-  };
+  if (window.screen.width < 400) {        
+    tableColumnHide = [11,12,13,1,2,4,5,6,7,9];
+  } 
+  // else {  
+  //   // var tableColumnHide = [11, 12, 13];
+  //   tableColumnHide = [11, 12, 13];
+  // };
   var table=
   $('#tableDevices').DataTable({
     'paging'       : true,
     'lengthChange' : true,
-    'lengthMenu'   : [[10, 25, 50, 100, 500, -1], [10, 25, 50, 100, 500, '<?php echo lang('Device_Tablelenght_all');?>']],
+    'lengthMenu'   : [[10, 25, 50, 100, 500, -1], [10, 25, 50, 100, 500, '<?= lang('Device_Tablelenght_all');?>']],
     'searching'    : true,
 
     'ordering'     : true,
@@ -265,20 +342,56 @@ function initializeDatatable () {
     // 'order'       : [[3,'desc'], [0,'asc']],
 
     'columnDefs'   : [
-      {visible:   false,         targets: tableColumnShow },
-      {className: 'text-center', targets: [3, 8, 9] },
-      {width:     '80px',        targets: [5, 6] },
-      {width:     '0px',         targets: 9 },
-      {orderData: [11],          targets: 7 },
+      {visible:   false,         targets: tableColumnHide },      
+      {className: 'text-center', targets: [mapIndx(3), mapIndx(4), mapIndx(9), mapIndx(10), mapIndx(15)] },      
+      {width:     '80px',        targets: [mapIndx(6), mapIndx(7), mapIndx(15)] },      
+      {width:     '30px',        targets: [mapIndx(10), mapIndx(13)] },      
+      {orderData: [mapIndx(12)],          targets: mapIndx(8) },
 
       // Device Name
-      {targets: [0],
-        'createdCell': function (td, cellData, rowData, row, col) {
-            $(td).html ('<b><a href="deviceDetails.php?mac='+ rowData[10] +'" class="">'+ cellData +'</a></b>');
+      {targets: [mapIndx(0)],
+        'createdCell': function (td, cellData, rowData, row, col) {            
+            $(td).html ('<b class="anonymizeDev"><a href="deviceDetails.php?mac='+ rowData[mapIndx(11)] +'" class="">'+ cellData +'</a></b>');
       } },
 
-      // Favorite
-      {targets: [3],
+      // Connected Devices       
+      {targets: [mapIndx(15)],
+        'createdCell': function (td, cellData, rowData, row, col) {
+            $(td).html ('<b><a href="./network.php?mac='+ rowData[mapIndx(11)] +'" class="">'+ cellData +'</a></b>');
+      } },
+
+      // Icon      
+      {targets: [mapIndx(3)],
+        'createdCell': function (td, cellData, rowData, row, col) {
+          if (!emptyArr.includes(cellData)){
+            $(td).html ('<i class="fa fa-'+cellData+' " style="font-size:16px"></i>');
+          } else {
+            $(td).html ('');
+          }
+      } },
+
+      // Full MAC      
+      {targets: [mapIndx(11)],
+        'createdCell': function (td, cellData, rowData, row, col) {
+          if (!emptyArr.includes(cellData)){
+            $(td).html ('<span class="anonymizeMac">'+cellData+'</span>');
+          } else {
+            $(td).html ('');
+          }
+      } },
+      
+      // IP address      
+      {targets: [mapIndx(12)],
+        'createdCell': function (td, cellData, rowData, row, col) {
+          if (!emptyArr.includes(cellData)){
+            $(td).html ('<span class="anonymizeIp">'+cellData+'</span>');
+          } else {
+            $(td).html ('');
+          }
+      } },
+      
+      // Favorite      
+      {targets: [mapIndx(4)],
         'createdCell': function (td, cellData, rowData, row, col) {
           if (cellData == 1){
             $(td).html ('<i class="fa fa-star text-yellow" style="font-size:16px"></i>');
@@ -287,14 +400,14 @@ function initializeDatatable () {
           }
       } },
         
-      // Dates
-      {targets: [5, 6],
+      // Dates      
+      {targets: [mapIndx(6), mapIndx(7)],
         'createdCell': function (td, cellData, rowData, row, col) {
           $(td).html (translateHTMLcodes (cellData));
       } },
 
-      // Random MAC
-      {targets: [8],
+      // Random MAC      
+      {targets: [mapIndx(9)],
         'createdCell': function (td, cellData, rowData, row, col) {
           if (cellData == 1){
             $(td).html ('<i data-toggle="tooltip" data-placement="right" title="Random MAC" style="font-size: 16px;" class="text-yellow glyphicon glyphicon-random"></i>');
@@ -303,8 +416,8 @@ function initializeDatatable () {
           }
       } },
 
-      // Status color
-      {targets: [9],
+      // Status color      
+      {targets: [mapIndx(10)],
         'createdCell': function (td, cellData, rowData, row, col) {
           switch (cellData) {
             case 'Down':      color='red';              break;
@@ -324,13 +437,13 @@ function initializeDatatable () {
     'language'    : {
       processing: '<table> <td width="130px" align="middle">Loading...</td><td><i class="ion ion-ios-loop-strong fa-spin fa-2x fa-fw"></td> </table>',
       emptyTable: 'No data',
-      "lengthMenu": "<?php echo lang('Device_Tablelenght');?>",
-      "search":     "<?php echo lang('Device_Searchbox');?>: ",
+      "lengthMenu": "<?= lang('Device_Tablelenght');?>",
+      "search":     "<?= lang('Device_Searchbox');?>: ",
       "paginate": {
-          "next":       "<?php echo lang('Device_Table_nav_next');?>",
-          "previous":   "<?php echo lang('Device_Table_nav_prev');?>"
+          "next":       "<?= lang('Device_Table_nav_next');?>",
+          "previous":   "<?= lang('Device_Table_nav_prev');?>"
       },
-      "info":           "<?php echo lang('Device_Table_info');?>",
+      "info":           "<?= lang('Device_Table_info');?>",
     }
   });
 
@@ -354,18 +467,27 @@ function initializeDatatable () {
 // -----------------------------------------------------------------------------
 // Gets a JSON list of rowID and mac from the displayed table in the UI
 function getDevicesFromTable(table)
-{
-  rowIDs = table.column(12, { 'search': 'applied' }).data().toArray()  // rowID is in hidden column 12
-  rowMACs = table.column(10, { 'search': 'applied' }).data().toArray() // MAC is in hidden column 10
+{  
+  rowIDs = table.column(mapIndx(13), { 'search': 'applied' }).data().toArray()  //   
+  rowMACs = table.column(mapIndx(11), { 'search': 'applied' }).data().toArray() // 
+  rowNames = table.column(mapIndx(0), { 'search': 'applied' }).data().toArray() // 
+  rowTypes = table.column(mapIndx(2), { 'search': 'applied' }).data().toArray() // 
+  rowIcons = table.column(mapIndx(3), { 'search': 'applied' }).data().toArray() // 
+  rowParentMAC = table.column(mapIndx(14), { 'search': 'applied' }).data().toArray() // 
+  rowStatus = table.column(mapIndx(10), { 'search': 'applied' }).data().toArray() // 
 
   result = []
 
   rowIDs.map(function(rowID, index){
-    result.push({"rowid": rowID, "mac":rowMACs[index]})
+    result.push({
+                  "rowid": rowID, 
+                  "mac"  : rowMACs[index], 
+                  "name" : rowNames[index],
+                  "type" : rowTypes[index],
+                  "icon" : rowIcons[index],
+                  "parentMac" : rowParentMAC[index],
+                  "status" : rowStatus[index] })
   })
-  
-  // console.log(rowIDs)
-  // console.log(result)  
 
   return JSON.stringify (result)
 }
@@ -392,6 +514,10 @@ function getDevicesTotals () {
 }
 
 
+// -----------------------------------------------------------------------------
+function getDeviceColumns () {
+
+}
 // -----------------------------------------------------------------------------
 function getDevicesList (status) {
   // Save status selected
@@ -399,13 +525,13 @@ function getDevicesList (status) {
 
   // Define color & title for the status selected
   switch (deviceStatus) {
-    case 'all':        tableTitle = '<?php echo lang('Device_Shortcut_AllDevices');?>';  color = 'aqua';    break;
-    case 'connected':  tableTitle = '<?php echo lang('Device_Shortcut_Connected');?>';   color = 'green';   break;
-    case 'favorites':  tableTitle = '<?php echo lang('Device_Shortcut_Favorites');?>';   color = 'yellow';  break;
-    case 'new':        tableTitle = '<?php echo lang('Device_Shortcut_NewDevices');?>';  color = 'yellow';  break;
-    case 'down':       tableTitle = '<?php echo lang('Device_Shortcut_DownAlerts');?>';  color = 'red';     break;
-    case 'archived':   tableTitle = '<?php echo lang('Device_Shortcut_Archived');?>';    color = 'gray';    break;
-    default:           tableTitle = '<?php echo lang('Device_Shortcut_Devices');?>';     color = 'gray';    break;
+    case 'all':        tableTitle = '<?= lang('Device_Shortcut_AllDevices');?>';  color = 'aqua';    break;
+    case 'connected':  tableTitle = '<?= lang('Device_Shortcut_Connected');?>';   color = 'green';   break;
+    case 'favorites':  tableTitle = '<?= lang('Device_Shortcut_Favorites');?>';   color = 'yellow';  break;
+    case 'new':        tableTitle = '<?= lang('Device_Shortcut_NewDevices');?>';  color = 'yellow';  break;
+    case 'down':       tableTitle = '<?= lang('Device_Shortcut_DownAlerts');?>';  color = 'red';     break;
+    case 'archived':   tableTitle = '<?= lang('Device_Shortcut_Archived');?>';    color = 'gray';    break;
+    default:           tableTitle = '<?= lang('Device_Shortcut_Devices');?>';     color = 'gray';    break;
   } 
 
   // Set title and color
@@ -419,3 +545,5 @@ function getDevicesList (status) {
 };
 
 </script>
+
+<script src="js/pialert_common.js"></script>

front/events.php

@@ -17,17 +17,17 @@
 <!-- Content header--------------------------------------------------------- -->
     <section class="content-header">
       <h1 id="pageTitle">
-         <?php echo lang('Events_Title');?>
+         <?= lang('Events_Title');?>
       </h1>
 
       <!-- period selector -->
       <span class="breadcrumb" style="top: 0px;">
         <select class="form-control" id="period" onchange="javascript: periodChanged();">
-          <option value="1 day"><?php echo lang('Events_Periodselect_today');?></option>
-          <option value="7 days"><?php echo lang('Events_Periodselect_LastWeek');?></option>
-          <option value="1 month" selected><?php echo lang('Events_Periodselect_LastMonth');?></option>
-          <option value="1 year"><?php echo lang('Events_Periodselect_LastYear');?></option>
-          <option value="100 years"><?php echo lang('Events_Periodselect_All');?></option>
+          <option value="1 day"><?= lang('Events_Periodselect_today');?></option>
+          <option value="7 days"><?= lang('Events_Periodselect_LastWeek');?></option>
+          <option value="1 month" selected><?= lang('Events_Periodselect_LastMonth');?></option>
+          <option value="1 year"><?= lang('Events_Periodselect_LastYear');?></option>
+          <option value="100 years"><?= lang('Events_Periodselect_All');?></option>
         </select>
       </span>
     </section>
@@ -42,7 +42,7 @@
           <a href="#" onclick="javascript: getEvents('all');">
             <div class="small-box bg-aqua">
               <div class="inner"> <h3 id="eventsAll"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_AllEvents');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_AllEvents');?></p>
               </div>
               <div class="icon"> <i class="fa fa-bolt text-aqua-40"></i> </div>
             </div>
@@ -54,7 +54,7 @@
           <a href="#" onclick="javascript: getEvents('sessions');">
             <div class="small-box bg-green">
               <div class="inner"> <h3 id="eventsSessions"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_Sessions');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_Sessions');?></p>
               </div>
               <div class="icon"> <i class="fa fa-plug text-green-40"></i> </div>
             </div>
@@ -66,7 +66,7 @@
           <a href="#" onclick="javascript: getEvents('missing');">
             <div  class="small-box bg-yellow">
               <div class="inner"> <h3 id="eventsMissing"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_MissSessions');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_MissSessions');?></p>
               </div>
               <div class="icon"> <i class="fa fa-exchange text-yellow-40"></i> </div>
             </div>
@@ -78,7 +78,7 @@
           <a href="#" onclick="javascript: getEvents('voided');">
             <div  class="small-box bg-yellow">
               <div class="inner"> <h3 id="eventsVoided"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_VoidSessions');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_VoidSessions');?></p>
               </div>
               <div class="icon"> <i class="fa fa-exclamation-circle text-yellow-40"></i> </div>
             </div>
@@ -90,7 +90,7 @@
           <a href="#" onclick="javascript: getEvents('new');">
             <div  class="small-box bg-yellow">
               <div class="inner"> <h3 id="eventsNewDevices"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_NewDevices');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_NewDevices');?></p>
               </div>
               <div class="icon"> <i class="ion ion-plus-round text-yellow-40"></i> </div>
             </div>
@@ -102,7 +102,7 @@
           <a href="#" onclick="javascript: getEvents('down');">
             <div  class="small-box bg-red">
               <div class="inner"> <h3 id="eventsDown"> -- </h3>
-                <p class="infobox_label"><?php echo lang('Events_Shortcut_DownAlerts');?></p>
+                <p class="infobox_label"><?= lang('Events_Shortcut_DownAlerts');?></p>
               </div>
               <div class="icon"> <i class="fa fa-warning text-red-40"></i> </div>
             </div>
@@ -127,18 +127,18 @@
               <table id="tableEvents" class="table table-bordered table-hover table-striped ">
                 <thead>
                 <tr>
-                  <th><?php echo lang('Events_TableHead_Order');?></th>
-                  <th><?php echo lang('Events_TableHead_Device');?></th>
-                  <th><?php echo lang('Events_TableHead_Owner');?></th>
-                  <th><?php echo lang('Events_TableHead_Date');?></th>
-                  <th><?php echo lang('Events_TableHead_EventType');?></th>
-                  <th><?php echo lang('Events_TableHead_Connection');?></th>
-                  <th><?php echo lang('Events_TableHead_Disconnection');?></th>
-                  <th><?php echo lang('Events_TableHead_Duration');?></th>
-                  <th><?php echo lang('Events_TableHead_DurationOrder');?></th>
-                  <th><?php echo lang('Events_TableHead_IP');?></th>
-                  <th><?php echo lang('Events_TableHead_IPOrder');?></th>
-                  <th><?php echo lang('Events_TableHead_AdditionalInfo');?></th>
+                  <th><?= lang('Events_TableHead_Order');?></th>
+                  <th><?= lang('Events_TableHead_Device');?></th>
+                  <th><?= lang('Events_TableHead_Owner');?></th>
+                  <th><?= lang('Events_TableHead_Date');?></th>
+                  <th><?= lang('Events_TableHead_EventType');?></th>
+                  <th><?= lang('Events_TableHead_Connection');?></th>
+                  <th><?= lang('Events_TableHead_Disconnection');?></th>
+                  <th><?= lang('Events_TableHead_Duration');?></th>
+                  <th><?= lang('Events_TableHead_DurationOrder');?></th>
+                  <th><?= lang('Events_TableHead_IP');?></th>
+                  <th><?= lang('Events_TableHead_IPOrder');?></th>
+                  <th><?= lang('Events_TableHead_AdditionalInfo');?></th>
                 </tr>
                 </thead>
               </table>
@@ -188,7 +188,7 @@
 // -----------------------------------------------------------------------------
 function main () {
   // get parameter value
-  $.get('php/server/parameters.php?action=get&parameter='+ parPeriod, function(data) {
+  $.get('php/server/parameters.php?action=get&defaultValue=1 day&parameter='+ parPeriod, function(data) {
     var result = JSON.parse(data);
     if (result) {
       period = result;
@@ -196,7 +196,7 @@ function main () {
     }
 
     // get parameter value
-    $.get('php/server/parameters.php?action=get&parameter='+ parTableRows, function(data) {
+    $.get('php/server/parameters.php?action=get&defaultValue=50&parameter='+ parTableRows, function(data) {
       var result = JSON.parse(data);
       result = parseInt(result, 10)
       if (Number.isInteger (result) ) {
@@ -253,13 +253,13 @@ function initializeDatatable () {
     'language'    : {
       processing: '<table><td width="130px" align="middle">Loading...</td><td><i class="ion ion-ios-loop-strong fa-spin fa-2x fa-fw"></td></table>',
       emptyTable: 'No data',
-      "lengthMenu": "<?php echo lang('Events_Tablelenght');?>",
-      "search":     "<?php echo lang('Events_Searchbox');?>: ",
+      "lengthMenu": "<?= lang('Events_Tablelenght');?>",
+      "search":     "<?= lang('Events_Searchbox');?>: ",
       "paginate": {
-          "next":       "<?php echo lang('Events_Table_nav_next');?>",
-          "previous":   "<?php echo lang('Events_Table_nav_prev');?>"
+          "next":       "<?= lang('Events_Table_nav_next');?>",
+          "previous":   "<?= lang('Events_Table_nav_prev');?>"
       },
-      "info":           "<?php echo lang('Events_Table_info');?>",
+      "info":           "<?= lang('Events_Table_info');?>",
     }
   });
 
@@ -311,13 +311,13 @@ function getEvents (p_eventsType) {
 
   // Define color & title for the status selected
   switch (eventsType) {
-    case 'all':       tableTitle = '<?php echo lang('Events_Shortcut_AllEvents');?>';      color = 'aqua';    sesionCols = false;  break;
-    case 'sessions':  tableTitle = '<?php echo lang('Events_Shortcut_Sessions');?>';       color = 'green';   sesionCols = true;   break;
-    case 'missing':   tableTitle = '<?php echo lang('Events_Shortcut_MissSessions');?>';   color = 'yellow';  sesionCols = true;   break;
-    case 'voided':    tableTitle = '<?php echo lang('Events_Shortcut_VoidSessions');?>';   color = 'yellow';  sesionCols = false;  break;
-    case 'new':       tableTitle = '<?php echo lang('Events_Shortcut_NewDevices');?>';     color = 'yellow';  sesionCols = false;  break;
-    case 'down':      tableTitle = '<?php echo lang('Events_Shortcut_DownAlerts');?>';     color = 'red';     sesionCols = false;  break;
-    default:          tableTitle = '<?php echo lang('Events_Shortcut_Events');?>';         boxClass = '';     sesionCols = false;  break;
+    case 'all':       tableTitle = '<?= lang('Events_Shortcut_AllEvents');?>';      color = 'aqua';    sesionCols = false;  break;
+    case 'sessions':  tableTitle = '<?= lang('Events_Shortcut_Sessions');?>';       color = 'green';   sesionCols = true;   break;
+    case 'missing':   tableTitle = '<?= lang('Events_Shortcut_MissSessions');?>';   color = 'yellow';  sesionCols = true;   break;
+    case 'voided':    tableTitle = '<?= lang('Events_Shortcut_VoidSessions');?>';   color = 'yellow';  sesionCols = false;  break;
+    case 'new':       tableTitle = '<?= lang('Events_Shortcut_NewDevices');?>';     color = 'yellow';  sesionCols = false;  break;
+    case 'down':      tableTitle = '<?= lang('Events_Shortcut_DownAlerts');?>';     color = 'red';     sesionCols = false;  break;
+    default:          tableTitle = '<?= lang('Events_Shortcut_Events');?>';         boxClass = '';     sesionCols = false;  break;
   } 
 
   // Set title and color

front/help_faq.php

@@ -8,13 +8,13 @@
     <section class="content-header">
     <?php require 'php/templates/notification.php'; ?>
       <h1 id="pageTitle">
-         <?php echo lang('HelpFAQ_Title');?>
+         <?= lang('HelpFAQ_Title');?>
       </h1>
     </section>
 
     <!-- Main content ---------------------------------------------------------- -->
     <section class="content">
-      <h4><?php echo lang('HelpFAQ_Cat_General');?></h4>
+      <h4><?= lang('HelpFAQ_Cat_General');?></h4>
 
        <div class="panel-group" id="accordion_gen">
         <div class="panel panel-default">
@@ -22,16 +22,16 @@
           <div class="panel-heading">
             <h4 class="panel-title">
               <a data-toggle="collapse" data-parent="#accordion_gen" href="#collapse100">
-              <?php echo lang('HelpFAQ_Cat_General_100_head');?></a>
+              <?= lang('HelpFAQ_Cat_General_100_head');?></a>
             </h4>
           </div>
 
           <div id="collapse100" class="panel-collapse collapse" style="font-size: 16px;">
-            <div class="panel-body"><?php echo lang('HelpFAQ_Cat_General_100_text_a');?>
+            <div class="panel-body"><?= lang('HelpFAQ_Cat_General_100_text_a');?>
               <span class="text-danger help_faq_code"><?php echo date_default_timezone_get(); ?></span><br>
-              <?php echo lang('HelpFAQ_Cat_General_100_text_b');?> 
+              <?= lang('HelpFAQ_Cat_General_100_text_b');?> 
               <span class="text-danger help_faq_code"><?php echo php_ini_loaded_file(); ?></span><br>
-              <?php echo lang('HelpFAQ_Cat_General_100_text_c');?>
+              <?= lang('HelpFAQ_Cat_General_100_text_c');?>
             </div>
           </div>
 
@@ -42,12 +42,12 @@
           <div class="panel-heading">
             <h4 class="panel-title">
               <a data-toggle="collapse" data-parent="#accordion_gen" href="#collapse101">
-              <?php echo lang('HelpFAQ_Cat_General_101_head');?></a>
+              <?= lang('HelpFAQ_Cat_General_101_head');?></a>
             </h4>
           </div>
           <div id="collapse101" class="panel-collapse collapse" style="font-size: 16px;">
             <div class="panel-body">
-              <?php echo lang('HelpFAQ_Cat_General_101_text');?>
+              <?= lang('HelpFAQ_Cat_General_101_text');?>
             </div>
           </div>
         </div>
@@ -55,12 +55,12 @@
           <div class="panel-heading">
             <h4 class="panel-title">
               <a data-toggle="collapse" data-parent="#accordion_gen" href="#collapse102">
-              <?php echo lang('HelpFAQ_Cat_General_102_head');?></a>
+              <?= lang('HelpFAQ_Cat_General_102_head');?></a>
             </h4>
           </div>
           <div id="collapse102" class="panel-collapse collapse" style="font-size: 16px;">
             <div class="panel-body">
-              <?php echo lang('HelpFAQ_Cat_General_102_text');?>
+              <?= lang('HelpFAQ_Cat_General_102_text');?>
             </div>
           </div>
         </div>
@@ -68,12 +68,12 @@
           <div class="panel-heading">
             <h4 class="panel-title">
               <a data-toggle="collapse" data-parent="#accordion_gen" href="#collapse102docker">
-              <?php echo lang('HelpFAQ_Cat_General_102docker_head');?></a>
+              <?= lang('HelpFAQ_Cat_General_102docker_head');?></a>
             </h4>
           </div>
           <div id="collapse102docker" class="panel-collapse collapse" style="font-size: 16px;">
             <div class="panel-body">
-              <?php echo lang('HelpFAQ_Cat_General_102docker_text');?>
+              <?= lang('HelpFAQ_Cat_General_102docker_text');?>
             </div>
           </div>
         </div>
@@ -81,48 +81,48 @@
           <div class="panel-heading">
             <h4 class="panel-title">
               <a data-toggle="collapse" data-parent="#accordion_gen" href="#collapse103">
-              <?php echo lang('HelpFAQ_Cat_General_103_head');?></a>
+              <?= lang('HelpFAQ_Cat_General_103_head');?></a>
             </h4>
           </div>
           <div id="collapse103" class="panel-collapse collapse" style="font-size: 16px;">
             <div class="panel-body">
-              <?php echo lang('HelpFAQ_Cat_General_103_text');?>
+              <?= lang('HelpFAQ_Cat_General_103_text');?>
             </div>
           </div>
         </div>
       </div> 
 
-<h4><?php echo lang('Navigation_Devices');?></h4>
+<h4><?= lang('Navigation_Devices');?></h4>
  <div class="panel-group" id="accordion_dev">
   <div class="panel panel-default">
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_dev" href="#collapse200">
-        <?php echo lang('HelpFAQ_Cat_Device_200_head');?></a>
+        <?= lang('HelpFAQ_Cat_Device_200_head');?></a>
       </h4>
     </div>
     <div id="collapse200" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-         <?php echo lang('HelpFAQ_Cat_Device_200_text');?>
+         <?= lang('HelpFAQ_Cat_Device_200_text');?>
       </div>
     </div>
   </div>
 </div> 
 
 
-<h4><?php echo lang('HelpFAQ_Cat_Detail');?></h4>
+<h4><?= lang('HelpFAQ_Cat_Detail');?></h4>
  <div class="panel-group" id="accordion_det">
   <div class="panel panel-default">
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_det" href="#collapse300">
-        <?php echo lang('HelpFAQ_Cat_Detail_300_head');?> "<?php echo lang('DevDetail_MainInfo_Network');?>" / "<?php echo lang('DevDetail_MainInfo_Network_Port');?>"?</a>
+        <?= lang('HelpFAQ_Cat_Detail_300_head');?> "<?= lang('DevDetail_MainInfo_Network');?>" / "<?= lang('DevDetail_MainInfo_Network_Port');?>"?</a>
       </h4>
     </div>
     <div id="collapse300" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        "<?php echo lang('DevDetail_MainInfo_Network');?>" <?php echo lang('HelpFAQ_Cat_Detail_300_text_a');?><br>
-        "<?php echo lang('DevDetail_MainInfo_Network_Port');?>" <?php echo lang('HelpFAQ_Cat_Detail_300_text_b');?>
+        "<?= lang('DevDetail_MainInfo_Network');?>" <?= lang('HelpFAQ_Cat_Detail_300_text_a');?><br>
+        "<?= lang('DevDetail_MainInfo_Network_Port');?>" <?= lang('HelpFAQ_Cat_Detail_300_text_b');?>
       </div>
     </div>
   </div>
@@ -130,12 +130,12 @@
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_det" href="#collapse301">
-        <?php echo lang('HelpFAQ_Cat_Detail_301_head_a');?> "<?php echo lang('DevDetail_EveandAl_ScanCycle');?>" <?php echo lang('HelpFAQ_Cat_Detail_301_head_b');?></a>
+        <?= lang('HelpFAQ_Cat_Detail_301_head_a');?> "<?= lang('DevDetail_EveandAl_ScanCycle');?>" <?= lang('HelpFAQ_Cat_Detail_301_head_b');?></a>
       </h4>
     </div>
     <div id="collapse301" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Detail_301_text');?>
+        <?= lang('HelpFAQ_Cat_Detail_301_text');?>
       </div>
     </div>
   </div>
@@ -143,12 +143,12 @@
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_det" href="#collapse302">
-        <?php echo lang('HelpFAQ_Cat_Detail_302_head_a');?> "<?php echo lang('DevDetail_EveandAl_RandomMAC');?>" <?php echo lang('HelpFAQ_Cat_Detail_302_head_b');?></a>
+        <?= lang('HelpFAQ_Cat_Detail_302_head_a');?> "<?= lang('DevDetail_EveandAl_RandomMAC');?>" <?= lang('HelpFAQ_Cat_Detail_302_head_b');?></a>
       </h4>
     </div>
     <div id="collapse302" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Detail_302_text');?>
+        <?= lang('HelpFAQ_Cat_Detail_302_text');?>
       </div>
     </div>
   </div>
@@ -156,29 +156,29 @@
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_det" href="#collapse303">
-        <?php echo lang('HelpFAQ_Cat_Detail_303_head');?></a>
+        <?= lang('HelpFAQ_Cat_Detail_303_head');?></a>
       </h4>
     </div>
     <div id="collapse303" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Detail_303_text');?>
+        <?= lang('HelpFAQ_Cat_Detail_303_text');?>
       </div>
     </div>
   </div>
 </div> 
 
-<h4><?php echo lang('Navigation_Presence');?></h4>
+<h4><?= lang('Navigation_Presence');?></h4>
  <div class="panel-group" id="accordion_pre">
   <div class="panel panel-default">
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_pre" href="#collapse400">
-        <?php echo lang('HelpFAQ_Cat_Presence_400_head');?></a>
+        <?= lang('HelpFAQ_Cat_Presence_400_head');?></a>
       </h4>
     </div>
     <div id="collapse400" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Presence_400_text');?>
+        <?= lang('HelpFAQ_Cat_Presence_400_text');?>
       </div>
     </div>
   </div>
@@ -186,29 +186,29 @@
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_pre" href="#collapse401">
-        <?php echo lang('HelpFAQ_Cat_Presence_401_head');?></a>
+        <?= lang('HelpFAQ_Cat_Presence_401_head');?></a>
       </h4>
     </div>
     <div id="collapse401" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Presence_401_text');?>
+        <?= lang('HelpFAQ_Cat_Presence_401_text');?>
       </div>
     </div>
   </div>
 </div> 
 
-<h4><?php echo lang('Navigation_Network');?></h4>
+<h4><?= lang('Navigation_Network');?></h4>
  <div class="panel-group" id="accordion_net">
   <div class="panel panel-default">
     <div class="panel-heading">
       <h4 class="panel-title">
         <a data-toggle="collapse" data-parent="#accordion_net" href="#collapse600">
-        <?php echo lang('HelpFAQ_Cat_Network_600_head');?></a>
+        <?= lang('HelpFAQ_Cat_Network_600_head');?></a>
       </h4>
     </div>
     <div id="collapse600" class="panel-collapse collapse" style="font-size: 16px;">
       <div class="panel-body">
-        <?php echo lang('HelpFAQ_Cat_Network_600_text');?>
+        <?= lang('HelpFAQ_Cat_Network_600_text');?>
       </div>
     </div>
   </div>

front/index.php

@@ -1,32 +1,43 @@
+<!-- Pi.Alert CSS -->
+<link rel="stylesheet" href="css/pialert.css">
+
 <?php
-
-
-require 'php/templates/language/lang.php';
-require 'php/templates/skinUI.php';
+require dirname(__FILE__).'/php/server/init.php';
 require 'php/templates/security.php';
 
+
+
 if ($Pia_WebProtection != 'true')
-  {
-      header('Location: devices.php');
-      $_SESSION["login"] = 1;
-      exit;
-  }
+{
+    header('Location: devices.php');
+    $_SESSION["login"] = 1;
+    exit;
+}
+
+// Logout
+if (isset ($_GET["action"]) && $_GET["action"] == 'logout')
+{
+  setcookie("PiAlert_SaveLogin", '', time()+1); // reset cookie
+  $_SESSION["login"] = 0;
+  header('Location: index.php');
+  exit;
+}
 
 // Password without Cookie check -> pass and set initial cookie
 if (isset ($_POST["loginpassword"]) && $Pia_Password == hash('sha256',$_POST["loginpassword"]))
-  {
-      header('Location: devices.php');
-      $_SESSION["login"] = 1;
-      if (isset($_POST['PWRemember'])) {setcookie("PiAlert_SaveLogin", hash('sha256',$_POST["loginpassword"]), time()+604800);}
-  }
+{
+    header('Location: devices.php');
+    $_SESSION["login"] = 1;
+    if (isset($_POST['PWRemember'])) {setcookie("PiAlert_SaveLogin", hash('sha256',$_POST["loginpassword"]), time()+604800);}
+}
 
 // active Session or valid cookie (cookie not extends)
 if (( isset ($_SESSION["login"]) && ($_SESSION["login"] == 1)) || (isset ($_COOKIE["PiAlert_SaveLogin"]) && $Pia_Password == $_COOKIE["PiAlert_SaveLogin"]))
-  {
-      header('Location: devices.php');
-      $_SESSION["login"] = 1;
-      if (isset($_POST['PWRemember'])) {setcookie("PiAlert_SaveLogin", hash('sha256',$_POST["loginpassword"]), time()+604800);}
-  }
+{
+    header('Location: devices.php');
+    $_SESSION["login"] = 1;
+    if (isset($_POST['PWRemember'])) {setcookie("PiAlert_SaveLogin", hash('sha256',$_POST["loginpassword"]), time()+604800);}
+}
 
 $login_headline = lang('Login_Toggle_Info_headline');
 $login_info = "";
@@ -36,22 +47,22 @@ $login_icon = 'fa-info';
 
 // no active session, cookie not checked
 if (isset ($_SESSION["login"]) == FALSE || $_SESSION["login"] != 1)
+{
+  if ($Pia_Password == '8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923adc6c92') 
   {
-    if ($Pia_Password == '8d969eef6ecad3c29a3a629280e686cf0c3f5d5a86aff3ca12020c923adc6c92') 
-    {
-      $login_info = lang('Login_Default_PWD');
-      $login_mode = 'danger';
-      $login_display_mode = 'display: block;';
-      $login_headline = lang('Login_Toggle_Alert_headline');
-      $login_icon = 'fa-ban';
-    } 
-    else 
-    {
-      $login_mode = 'info';
-      $login_display_mode = 'display: none;';
-      $login_headline = lang('Login_Toggle_Info_headline');
-      $login_icon = 'fa-info';
-    }
+    $login_info = lang('Login_Default_PWD');
+    $login_mode = 'danger';
+    $login_display_mode = 'display: block;';
+    $login_headline = lang('Login_Toggle_Alert_headline');
+    $login_icon = 'fa-ban';
+  } 
+  else 
+  {
+    $login_mode = 'info';
+    $login_display_mode = 'display: none;';
+    $login_headline = lang('Login_Toggle_Info_headline');
+    $login_icon = 'fa-info';
+  }
 }
 
 // ##################################################
@@ -92,16 +103,16 @@ if ($ENABLED_DARKMODE === True) {
   <link rel="stylesheet" href="/front/css/offline-font.css">
 </head>
 <body class="hold-transition login-page">
-<div class="login-box">
+<div class="login-box login-custom">
   <div class="login-logo">
     <a href="/index2.php">Pi.<b>Alert</b></a>
   </div>
   <!-- /.login-logo -->
   <div class="login-box-body">
-    <p class="login-box-msg"><?php echo lang('Login_Box');?></p>
+    <p class="login-box-msg"><?= lang('Login_Box');?></p>
       <form action="index.php" method="post">
       <div class="form-group has-feedback">
-        <input type="password" class="form-control" placeholder="<?php echo lang('Login_Psw-box');?>" name="loginpassword">
+        <input type="password" class="form-control" placeholder="<?= lang('Login_Psw-box');?>" name="loginpassword">
         <span class="glyphicon glyphicon-lock form-control-feedback"></span>
       </div>
       <div class="row">
@@ -110,21 +121,21 @@ if ($ENABLED_DARKMODE === True) {
             <label>
               <input type="checkbox" name="PWRemember">
                 <div style="margin-left: 10px; display: inline-block; vertical-align: top;"> 
-                  <?php echo lang('Login_Remember');?><br><span style="font-size: smaller"><?php echo lang('Login_Remember_small');?></span>
+                  <?= lang('Login_Remember');?><br><span style="font-size: smaller"><?= lang('Login_Remember_small');?></span>
                 </div>
             </label>
           </div>
         </div>
         <!-- /.col -->
         <div class="col-xs-4" style="padding-top: 10px;">
-          <button type="submit" class="btn btn-primary btn-block btn-flat"><?php echo lang('Login_Submit');?></button>
+          <button type="submit" class="btn btn-primary btn-block btn-flat"><?= lang('Login_Submit');?></button>
         </div>
         <!-- /.col --> 
       </div>
     </form>
 
     <div style="padding-top: 10px;">
-      <button class="btn btn-xs btn-primary btn-block btn-flat" onclick="Passwordhinfo()"><?php echo lang('Login_Toggle_Info');?></button>
+      <button class="btn btn-xs btn-primary btn-block btn-flat" onclick="Passwordhinfo()"><?= lang('Login_Toggle_Info');?></button>
     </div>
 
   </div>
@@ -137,7 +148,7 @@ if ($ENABLED_DARKMODE === True) {
           <button type="button" class="close" data-dismiss="alert" aria-hidden="true"><3E></button>
           <h4><i class="icon fa <?php echo $login_icon;?>"></i><?php echo $login_headline;?></h4>
           <p><?php echo $login_info;?></p>
-          <p><?php echo lang('Login_Psw_run');?><br><span style="border: solid 1px yellow; padding: 2px;">./reset_password.sh <?php echo lang('Login_Psw_new');?></span><br><?php echo lang('Login_Psw_folder');?></p>
+          <p><?= lang('Login_Psw_run');?><br><span style="border: solid 1px yellow; padding: 2px;"> /home/pi/pialert/back/pialert-cli set_password <?= lang('Login_Psw_new');?></span><br><?= lang('Login_Psw_folder');?></p>
       </div>
   </div>
 

front/js/pialert_common.js

@@ -10,7 +10,7 @@
 // -----------------------------------------------------------------------------
 var timerRefreshData = ''
 var modalCallbackFunction = '';
-var emptyArr            = ['undefined', "", undefined, null];
+var emptyArr            = ['undefined', "", undefined, null, 'null'];
 
 // urlParams = new Proxy(new URLSearchParams(window.location.search), {
 //   get: (searchParams, prop) => searchParams.get(prop.toString()),
@@ -206,6 +206,13 @@ function sanitize(data)
   return data.replace(/(\r\n|\n|\r)/gm,"").replace(/[^\x00-\x7F]/g, "")
 }
 
+// -----------------------------------------------------------------------------
+function numberArrayFromString(data)
+{
+  data = JSON.parse(sanitize(data));
+  return data.replace(/\[|\]/g, '').split(',').map(Number);
+}
+
 // -----------------------------------------------------------------------------
 function setParameter (parameter, value) {
   // Retry
@@ -230,11 +237,11 @@ function setParameter (parameter, value) {
 
 
 // -----------------------------------------------------------------------------  
-function saveData(functionName, index, value) {
+function saveData(functionName, id, value) {
   $.ajax({
     method: "GET",
     url: "php/server/devices.php",
-    data: { action: functionName, index: index, value:value  },
+    data: { action: functionName, id: id, value:value  },
     success: function(data) {      
         
         if(sanitize(data) == 'OK')
@@ -253,6 +260,16 @@ function saveData(functionName, index, value) {
 }
 
 
+// -----------------------------------------------------------------------------
+// remove an item from an array
+function removeItemFromArray(arr, value) {
+  var index = arr.indexOf(value);
+  if (index > -1) {
+    arr.splice(index, 1);
+  }
+  return arr;
+}
+
 // -----------------------------------------------------------------------------
 function sleep(milliseconds) {
   const date = Date.now();
@@ -273,14 +290,30 @@ function settingsChanged()
   };
 }
 
+// -----------------------------------------------------------------------------
+function getQueryString(key){
+  params = new Proxy(new URLSearchParams(window.location.search), {
+    get: (searchParams, prop) => searchParams.get(prop),
+  });
+
+  tmp = params[key] 
+  
+  result = emptyArr.includes(tmp) ? "" : tmp;
+
+  return result
+}  
 // -----------------------------------------------------------------------------
 function translateHTMLcodes (text) {
-  if (text == null) {
+  if (text == null || emptyArr.includes(text)) {
     return null;
+  } else if (typeof text === 'string' || text instanceof String)
+  {
+    var text2 = text.replace(new RegExp(' ', 'g'), "&nbsp");
+    text2 = text2.replace(new RegExp('<', 'g'), "&lt");
+    return text2;
   }
-  var text2 = text.replace(new RegExp(' ', 'g'), "&nbsp");
-  text2 = text2.replace(new RegExp('<', 'g'), "&lt");
-  return text2;
+
+  return "";
 }
 
 
@@ -312,4 +345,30 @@ function openInNewTab (url) {
 }
 
 
+// -----------------------------------------------------------------------------
+function navigateToDeviceWithIp (ip) {
+
+  $.get('api/table_devices.json', function(res) {    
+        
+    devices = res["data"];
+
+    mac = ""
+    
+    $.each(devices, function(index, obj) {
+      
+      if(obj.dev_LastIP.trim() == ip.trim())
+      {
+        mac = obj.dev_MAC;
+
+        window.open(window.location.origin +'/deviceDetails.php?mac=' + mac , "_blank");
+      }
+    });
+
+
+    
+  });
+}
+
+
+
 

front/maintenance.php

@@ -11,19 +11,6 @@
 //  leiweibau  2022        https://github.com/leiweibau     GNU GPLv3
 //------------------------------------------------------------------------------
 
-// Language selector config ----------------------------------------------------
-//
-// For security reasons, new language files must be entered into this array.
-// The files in the language directory are compared with this array and only 
-// then accepted.
-//
-$pia_installed_langs = array('en_us', 
-                             'de_de',
-                             'es_es');
-//
-// In addition to this, the language must also be added to the select tag in 
-// line 235. Later, the whole thing may become dynamic.
-
 // Skin selector config ----------------------------------------------------
 //
 // For security reasons, new language files must be entered into this array.
@@ -57,7 +44,7 @@ $pia_installed_skins = array('skin-black-light',
     <section class="content-header">
     <?php require 'php/templates/notification.php'; ?>
       <h1 id="pageTitle">
-         <?php echo lang('Maintenance_Title');?>
+         <?= lang('Maintenance_Title');?>
       </h1>
     </section>
 
@@ -144,32 +131,35 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
               </div>
               <div class="box-body" style="padding-bottom: 5px;">
                 <div class="db_info_table">
-                    <div class="db_info_table_row">
-                        <div class="db_info_table_cell" style="min-width: 140px"><?php echo lang('Maintenance_version');?></div>
+                    <div class="db_info_table_row">                      
+                        <div class="db_info_table_cell" style="min-width: 140px"><?= lang('Maintenance_version');?>
+                          <a href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/VERSIONS.md" target="_blank"> <span><i class="fa fa-circle-question"></i></a><span>
+
+                        </div>
                         <div class="db_info_table_cell">
                         <div class="version" id="version" data-build-time="<?php echo file_get_contents( "buildtimestamp.txt");?>"><?php echo '<span id="new-version-text" class="myhidden">' .lang('Maintenance_new_version').'</span>'.'<span id="current-version-text" class="myhidden">' .lang('Maintenance_current_version').'</span>';?></div>
                         </div>
                     </div>
                     <div class="db_info_table_row">
-                        <div class="db_info_table_cell" style="min-width: 140px"><?php echo lang('Maintenance_database_path');?></div>
+                        <div class="db_info_table_cell" style="min-width: 140px"><?= lang('Maintenance_database_path');?></div>
                         <div class="db_info_table_cell">
                             <?php echo $pia_db;?>
                         </div>
                     </div>
                     <div class="db_info_table_row">
-                        <div class="db_info_table_cell"><?php echo lang('Maintenance_database_size');?></div>
+                        <div class="db_info_table_cell"><?= lang('Maintenance_database_size');?></div>
                         <div class="db_info_table_cell">
                             <?php echo $pia_db_size;?>
                         </div>
                     </div>
                     <div class="db_info_table_row">
-                        <div class="db_info_table_cell"><?php echo lang('Maintenance_database_lastmod');?></div>
+                        <div class="db_info_table_cell"><?= lang('Maintenance_database_lastmod');?></div>
                         <div class="db_info_table_cell">
                             <?php echo $pia_db_mod;?>
                         </div>
                     </div>
                     <div class="db_info_table_row">
-                        <div class="db_info_table_cell"><?php echo lang('Maintenance_database_backup');?></div>
+                        <div class="db_info_table_cell"><?= lang('Maintenance_database_backup');?></div>
                         <div class="db_info_table_cell">
                             <?php echo $Pia_Archive_count.' '.lang('Maintenance_database_backup_found').' / '.lang('Maintenance_database_backup_total').': '.$Pia_Archive_diskusage;?>
                         </div>
@@ -184,44 +174,27 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
     <div class="nav-tabs-custom">
     <ul class="nav nav-tabs">
         <li class="active">
-          <a id="tab_Settings_id" href="#tab_Settings" data-toggle="tab"><?php echo lang('Maintenance_Tools_Tab_UISettings');?></a>
+          <a id="tab_Settings_id" href="#tab_Settings" data-toggle="tab"><?= lang('Maintenance_Tools_Tab_UISettings');?></a>
         </li>
         <li>
-          <a id="tab_DBTools_id" href="#tab_DBTools" data-toggle="tab"><?php echo lang('Maintenance_Tools_Tab_Tools');?></a>
+          <a id="tab_DBTools_id" href="#tab_DBTools" data-toggle="tab"><?= lang('Maintenance_Tools_Tab_Tools');?></a>
         </li>
         <li>
-          <a id="tab_BackupRestore_id" href="#tab_BackupRestore" data-toggle="tab"><?php echo lang('Maintenance_Tools_Tab_BackupRestore');?></a>
+          <a id="tab_BackupRestore_id" href="#tab_BackupRestore" data-toggle="tab"><?= lang('Maintenance_Tools_Tab_BackupRestore');?></a>
         </li>
         <li>
-          <a id="tab_Logging_id" href="#tab_Logging" data-toggle="tab"><?php echo lang('Maintenance_Tools_Tab_Logging');?></a>
+          <a id="tab_Logging_id" href="#tab_Logging" data-toggle="tab"><?= lang('Maintenance_Tools_Tab_Logging');?></a>
         </li>
     </ul>
     <div class="tab-content">
         <div class="tab-pane active" id="tab_Settings">
                 <div class="db_info_table">
-                    <div class="db_info_table_row">
-                        <div class="db_tools_table_cell_a" style="text-align:center;">
-                            <form method="post" action="maintenance.php">
-                              <div style="display: inline-block;">
-                                  <select name="langselector" id="langselector" class="form-control bg-green"  style="width:160px; margin-bottom:5px;">
-                                      <option value=""><?php echo lang('Maintenance_lang_selector_empty');?></option>
-                                      <option value="en_us"><?php echo lang('Maintenance_lang_en_us');?></option>
-                                      <option value="de_de"><?php echo lang('Maintenance_lang_de_de');?></option>
-                                      <option value="es_es"><?php echo lang('Maintenance_lang_es_es');?></option>
-                                  </select>
-                              </div>                            
-                            </form>
-                        </div>
-                        <div class="db_info_table_cell" style="padding: 10px; height:40px; text-align:left; vertical-align: middle;">
-                            <?php echo lang('Maintenance_lang_selector_text');?>
-                        </div>                    
-                    </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="text-align: center;">
                             <form method="post" action="maintenance.php">
                             <div style="display: inline-block; text-align: center;">
                                 <select name="skinselector" class="form-control bg-green" style="width:160px; margin-bottom:5px;">
-                                    <option value=""><?php echo lang('Maintenance_themeselector_empty');?></option>
+                                    <option value=""><?= lang('Maintenance_themeselector_empty');?></option>
                                     <option value="skin-black-light">black light</option>
                                     <option value="skin-black">black</option>
                                     <option value="skin-blue-light">blue light</option>
@@ -235,60 +208,94 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                     <option value="skin-yellow-light">yellow light</option>
                                     <option value="skin-yellow">yellow</option>
                                 </select></div>
-                            <div style="display: block;"><input type="submit" name="skinselector_set" value="<?php echo lang('Maintenance_themeselector_apply');?>" class="btn bg-green" style="width:160px;">
+                            <div style="display: block;"><input type="submit" name="skinselector_set" value="<?= lang('Maintenance_themeselector_apply');?>" class="btn bg-green" style="width:160px;">
                                 <?php // echo $pia_skin_test; ?>
                             </div>
                             </form>
                         </div>
                         <div class="db_info_table_cell" style="padding: 10px; height:40px; text-align:left; vertical-align: middle;">
-                            <?php echo lang('Maintenance_themeselector_text'); ?>
+                            <?= lang('Maintenance_themeselector_text'); ?>
                         </div>    
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a">
-                            <button type="button" class="btn bg-green dbtools-button" id="btnPiaEnableDarkmode" onclick="askPiaEnableDarkmode()"><?php echo lang('Maintenance_Tool_darkmode');?></button>
+                            <button type="button" class="btn bg-green dbtools-button" id="btnToggleDarkmode" onclick="askToggleDarkmode()"><?= lang('Maintenance_Tool_darkmode');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_darkmode_text');?></div>
-                    </div>                    
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_darkmode_text');?></div>
+                    </div>   
+                    <div class="db_info_table_row">
+                        <div class="db_tools_table_cell_a">
+                          <div class="form-group" > 
+                            <div class="input-group" > 
+                              <select id="columnsSelect" class="form-control select2 select2-hidden-accessible" multiple=""   style="width: 100%;"  tabindex="-1" aria-hidden="true">
+                                <option value="0"><?= lang('Device_TableHead_Name');?></option>
+                                <option value="1"><?= lang('Device_TableHead_Owner');?></option>
+                                <option value="2"><?= lang('Device_TableHead_Type');?></option>
+                                <option value="3"><?= lang('Device_TableHead_Icon');?></option>
+                                <option value="4"><?= lang('Device_TableHead_Favorite');?></option>
+                                <option value="5"><?= lang('Device_TableHead_Group');?></option>
+                                <option value="6"><?= lang('Device_TableHead_FirstSession');?></option>
+                                <option value="7"><?= lang('Device_TableHead_LastSession');?></option>
+                                <option value="8"><?= lang('Device_TableHead_LastIP');?></option>
+                                <option value="9"><?= lang('Device_TableHead_MAC');?></option>
+                                <option value="10"><?= lang('Device_TableHead_Status');?></option>                            
+                                <option value="11"><?= lang('Device_TableHead_MAC_full');?></option>                            
+                                <option value="12"><?= lang('Device_TableHead_LastIPOrder');?></option>
+                                <option value="13"><?= lang('Device_TableHead_Rowid');?></option>
+                                <option value="14"><?= lang('Device_TableHead_Parent_MAC');?></option>
+                                <option value="15"><?= lang('Device_TableHead_Connected_Devices');?></option>
+                                <option value="16"><?= lang('Device_TableHead_Location');?></option>
+                                <option value="17"><?= lang('Device_TableHead_Vendor');?></option>
+                              </select>
+                              <span class="input-group-addon"><i title="<?= lang('Gen_Save');?>" class="fa fa-save  pointer" onclick="saveSelectedColumns();"></i></span>   
+                            </div>
+                          </div>
+
+                        </div>
+                        
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_displayed_columns_text');?></div>
+                    </div>  
+                    
+                    
                 </div>
         </div>
         <div class="tab-pane" id="tab_DBTools">
                 <div class="db_info_table">
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteMAC" onclick="askDeleteDevicesWithEmptyMACs()"><?php echo lang('Maintenance_Tool_del_empty_macs');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteMAC" onclick="askDeleteDevicesWithEmptyMACs()"><?= lang('Maintenance_Tool_del_empty_macs');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_empty_macs_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_empty_macs_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteMAC" onclick="askDeleteAllDevices()"><?php echo lang('Maintenance_Tool_del_alldev');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteMAC" onclick="askDeleteAllDevices()"><?= lang('Maintenance_Tool_del_alldev');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_alldev_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_alldev_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteUnknown" onclick="askDeleteUnknown()"><?php echo lang('Maintenance_Tool_del_unknowndev');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteUnknown" onclick="askDeleteUnknown()"><?= lang('Maintenance_Tool_del_unknowndev');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_unknowndev_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_unknowndev_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteEvents" onclick="askDeleteEvents()"><?php echo lang('Maintenance_Tool_del_allevents');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteEvents" onclick="askDeleteEvents()"><?= lang('Maintenance_Tool_del_allevents');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_allevents_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_allevents_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteEvents30" onclick="askDeleteEvents30()"><?php echo lang('Maintenance_Tool_del_allevents30');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteEvents30" onclick="askDeleteEvents30()"><?= lang('Maintenance_Tool_del_allevents30');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_allevents30_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_allevents30_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteActHistory" onclick="askDeleteActHistory()"><?php echo lang('Maintenance_Tool_del_ActHistory');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnDeleteActHistory" onclick="askDeleteActHistory()"><?= lang('Maintenance_Tool_del_ActHistory');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_del_ActHistory_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_del_ActHistory_text');?></div>
                     </div>
                 </div>
         </div>
@@ -296,33 +303,33 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                 <div class="db_info_table">
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaBackupDBtoArchive" onclick="askPiaBackupDBtoArchive()"><?php echo lang('Maintenance_Tool_backup');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaBackupDBtoArchive" onclick="askPiaBackupDBtoArchive()"><?= lang('Maintenance_Tool_backup');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_backup_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_backup_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaRestoreDBfromArchive" onclick="askPiaRestoreDBfromArchive()"><?php echo lang('Maintenance_Tool_restore');?><br><?php echo $latestbackup_date;?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaRestoreDBfromArchive" onclick="askPiaRestoreDBfromArchive()"><?= lang('Maintenance_Tool_restore');?><br><?php echo $latestbackup_date;?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_restore_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_restore_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaPurgeDBBackups" onclick="askPiaPurgeDBBackups()"><?php echo lang('Maintenance_Tool_purgebackup');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnPiaPurgeDBBackups" onclick="askPiaPurgeDBBackups()"><?= lang('Maintenance_Tool_purgebackup');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_purgebackup_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_purgebackup_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn bg-green dbtools-button" id="btnExportCSV" onclick="askExportCSV()"><?php echo lang('Maintenance_Tool_ExportCSV');?></button>
+                            <button type="button" class="btn btn-default pa-btn bg-green dbtools-button" id="btnExportCSV" onclick="askExportCSV()"><?= lang('Maintenance_Tool_ExportCSV');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_ExportCSV_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_ExportCSV_text');?></div>
                     </div>
                     <div class="db_info_table_row">
                         <div class="db_tools_table_cell_a" style="">
-                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnImportCSV" onclick="askImportCSV()"><?php echo lang('Maintenance_Tool_ImportCSV');?></button>
+                            <button type="button" class="btn btn-default pa-btn pa-btn-delete bg-red dbtools-button" id="btnImportCSV" onclick="askImportCSV()"><?= lang('Maintenance_Tool_ImportCSV');?></button>
                         </div>
-                        <div class="db_tools_table_cell_b"><?php echo lang('Maintenance_Tool_ImportCSV_text');?></div>
+                        <div class="db_tools_table_cell_b"><?= lang('Maintenance_Tool_ImportCSV_text');?></div>
                     </div>
                  </div>
         </div>
@@ -340,7 +347,7 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                 <span class="span-padding"><a href="./log/pialert.log" target="_blank"><i class="fa fa-download"></i> </a></span>
                               </div></div>             
                                 <div class="log-purge">
-                                  <button class="btn btn-primary" onclick="logManage('pialert.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
+                                  <button class="btn btn-primary" onclick="logManage('pialert.log','cleanLog')"><?= lang('Gen_Purge');?></button>
                                 </div>
                               </div>
                             </div>
@@ -356,29 +363,11 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                 <span class="span-padding"><a href="./log/pialert_front.log"><i class="fa fa-download"></i> </a></span>
                               </div></div>
                                 <div class="log-purge">
-                                  <button class="btn btn-primary" onclick="logManage('pialert_front.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
+                                  <button class="btn btn-primary" onclick="logManage('pialert_front.log','cleanLog')"><?= lang('Gen_Purge');?></button>
                                 </div>
                               </div>
                             </div>
-                        </div>
-                        <div class="log-area">
-                             
-                             <div class="row logs-row">
-                               <textarea id="pialert_pholus_log" class="logs" cols="70" rows="10" wrap='off' readonly><?php echo file_get_contents( "./log/pialert_pholus.log" ); ?>
-                               </textarea>                              
-                             </div>                          
-                             <div class="row logs-row" >
-                               <div> 
-                                 <div class="log-file">pialert_pholus.log<div class="logs-size"><?php echo number_format((filesize("./log/pialert_pholus.log") / 1000000),2,",",".") . ' MB';?> 
-                                 <span class="span-padding"><a href="./log/pialert_pholus.log"><i class="fa fa-download"></i> </a></span> 
-                                </div></div>                         
-                                 <div class="log-purge">
-                                   <button class="btn btn-primary" onclick="logManage('pialert_pholus.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
-                                 </div>                            
-                               </div>                            
-                             </div>                            
- 
-                         </div>    
+                        </div>                           
                          <div class="log-area">
                              
                              <div class="row logs-row">
@@ -391,7 +380,7 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                  <span class="span-padding"><a href="./log/pialert_pholus_lastrun.log"><i class="fa fa-download"></i> </a></span>
                                 </div></div>                          
                                  <div class="log-purge">                                 
-                                   <button class="btn btn-primary" onclick="logManage('pialert_pholus_lastrun.log','cleanLog')"><?php echo lang('Gen_Purge');?></button> 
+                                   <button class="btn btn-primary" onclick="logManage('pialert_pholus_lastrun.log','cleanLog')"><?= lang('Gen_Purge');?></button> 
                                  </div>                            
                                </div>                            
                              </div>                            
@@ -409,7 +398,7 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                 <span class="span-padding"><a href="./log/IP_changes.log"><i class="fa fa-download"></i> </a></span>
                               </div></div>                          
                                 <div class="log-purge">
-                                  <button class="btn btn-primary" onclick="logManage('IP_changes.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
+                                  <button class="btn btn-primary" onclick="logManage('IP_changes.log','cleanLog')"><?= lang('Gen_Purge');?></button>
                                 </div>                            
                               </div>                            
                             </div>                            
@@ -426,7 +415,7 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                                 <span class="span-padding"><a href="./log/stdout.log"><i class="fa fa-download"></i> </a></span>
                               </div></div>
                                 <div class="log-purge">
-                                  <button class="btn btn-primary" onclick="logManage('stdout.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
+                                  <button class="btn btn-primary" onclick="logManage('stdout.log','cleanLog')"><?= lang('Gen_Purge');?></button>
                                 </div>
                               </div>
                           </div>
@@ -443,7 +432,7 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
                               <span class="span-padding"><a href="./log/stderr.log"><i class="fa fa-download"></i> </a></span>
                             </div></div>
                               <div class="log-purge">
-                                <button class="btn btn-primary" onclick="logManage('stderr.log','cleanLog')"><?php echo lang('Gen_Purge');?></button>
+                                <button class="btn btn-primary" onclick="logManage('stderr.log','cleanLog')"><?= lang('Gen_Purge');?></button>
                               </div>                            
                               </div>                            
                             </div>
@@ -482,6 +471,8 @@ if (isset($_POST['submit']) && submit && isset($_POST['skinselector_set'])) {
 <!-- ----------------------------------------------------------------------- -->
 
 
+
+
 <script>
 
 var emptyArr = ['undefined', "", undefined, null];
@@ -492,7 +483,7 @@ initializeTabs();
 // delete devices with emty macs
 function askDeleteDevicesWithEmptyMACs () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_empty_macs_noti');?>', '<?php echo lang('Maintenance_Tool_del_empty_macs_noti_text');?>',
+  showModalWarning('<?= lang('Maintenance_Tool_del_empty_macs_noti');?>', '<?= lang('Maintenance_Tool_del_empty_macs_noti_text');?>',
     'Cancel', 'Delete', 'deleteDevicesWithEmptyMACs');
 }
 function deleteDevicesWithEmptyMACs()
@@ -506,8 +497,8 @@ function deleteDevicesWithEmptyMACs()
 // delete all devices 
 function askDeleteAllDevices () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_alldev_noti');?>', '<?php echo lang('Maintenance_Tool_del_alldev_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Delete');?>', 'deleteAllDevices');
+  showModalWarning('<?= lang('Maintenance_Tool_del_alldev_noti');?>', '<?= lang('Maintenance_Tool_del_alldev_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Delete');?>', 'deleteAllDevices');
 }
 function deleteAllDevices()
 { 
@@ -520,8 +511,8 @@ function deleteAllDevices()
 // delete all (unknown) devices 
 function askDeleteUnknown () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_unknowndev_noti');?>', '<?php echo lang('Maintenance_Tool_del_unknowndev_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Delete');?>', 'deleteUnknownDevices');
+  showModalWarning('<?= lang('Maintenance_Tool_del_unknowndev_noti');?>', '<?= lang('Maintenance_Tool_del_unknowndev_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Delete');?>', 'deleteUnknownDevices');
 }
 function deleteUnknownDevices()
 { 
@@ -534,8 +525,8 @@ function deleteUnknownDevices()
 // delete all Events 
 function askDeleteEvents () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_allevents_noti');?>', '<?php echo lang('Maintenance_Tool_del_allevents_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Delete');?>', 'deleteEvents');
+  showModalWarning('<?= lang('Maintenance_Tool_del_allevents_noti');?>', '<?= lang('Maintenance_Tool_del_allevents_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Delete');?>', 'deleteEvents');
 }
 function deleteEvents()
 { 
@@ -548,8 +539,8 @@ function deleteEvents()
 // delete all Events older than 30 days
 function askDeleteEvents30 () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_allevents30_noti');?>', '<?php echo lang('Maintenance_Tool_del_allevents30_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Delete');?>', 'deleteEvents30');
+  showModalWarning('<?= lang('Maintenance_Tool_del_allevents30_noti');?>', '<?= lang('Maintenance_Tool_del_allevents30_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Delete');?>', 'deleteEvents30');
 }
 function deleteEvents30()
 { 
@@ -562,8 +553,8 @@ function deleteEvents30()
 // delete History 
 function askDeleteActHistory () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_del_ActHistory_noti');?>', '<?php echo lang('Maintenance_Tool_del_ActHistory_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Delete');?>', 'deleteActHistory');
+  showModalWarning('<?= lang('Maintenance_Tool_del_ActHistory_noti');?>', '<?= lang('Maintenance_Tool_del_ActHistory_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Delete');?>', 'deleteActHistory');
 }
 function deleteActHistory()
 { 
@@ -576,8 +567,8 @@ function deleteActHistory()
 // Backup DB to Archive 
 function askPiaBackupDBtoArchive () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_backup_noti');?>', '<?php echo lang('Maintenance_Tool_backup_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Backup');?>', 'PiaBackupDBtoArchive');
+  showModalWarning('<?= lang('Maintenance_Tool_backup_noti');?>', '<?= lang('Maintenance_Tool_backup_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Backup');?>', 'PiaBackupDBtoArchive');
 }
 function PiaBackupDBtoArchive()
 { 
@@ -590,8 +581,8 @@ function PiaBackupDBtoArchive()
 // Restore DB from Archive 
 function askPiaRestoreDBfromArchive () {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_restore_noti');?>', '<?php echo lang('Maintenance_Tool_restore_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Restore');?>', 'PiaRestoreDBfromArchive');
+  showModalWarning('<?= lang('Maintenance_Tool_restore_noti');?>', '<?= lang('Maintenance_Tool_restore_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Restore');?>', 'PiaRestoreDBfromArchive');
 }
 function PiaRestoreDBfromArchive()
 { 
@@ -604,8 +595,8 @@ function PiaRestoreDBfromArchive()
 // Purge Backups 
 function askPiaPurgeDBBackups() {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_purgebackup_noti');?>', '<?php echo lang('Maintenance_Tool_purgebackup_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Purge');?>', 'PiaPurgeDBBackups');
+  showModalWarning('<?= lang('Maintenance_Tool_purgebackup_noti');?>', '<?= lang('Maintenance_Tool_purgebackup_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Purge');?>', 'PiaPurgeDBBackups');
 }
 function PiaPurgeDBBackups()
 { 
@@ -618,8 +609,8 @@ function PiaPurgeDBBackups()
 // Export CSV
 function askExportCSV() {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_ExportCSV_noti');?>', '<?php echo lang('Maintenance_Tool_ExportCSV_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Okay');?>', 'ExportCSV');
+  showModalWarning('<?= lang('Maintenance_Tool_ExportCSV_noti');?>', '<?= lang('Maintenance_Tool_ExportCSV_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Okay');?>', 'ExportCSV');
 }
 function ExportCSV()
 { 
@@ -630,8 +621,8 @@ function ExportCSV()
 // Import CSV
 function askImportCSV() {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_ImportCSV_noti');?>', '<?php echo lang('Maintenance_Tool_ImportCSV_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Okay');?>', 'ImportCSV');
+  showModalWarning('<?= lang('Maintenance_Tool_ImportCSV_noti');?>', '<?= lang('Maintenance_Tool_ImportCSV_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Okay');?>', 'ImportCSV');
 }
 function ImportCSV()
 {   
@@ -641,47 +632,61 @@ function ImportCSV()
   });
 }
 
+
+// --------------------------------------------------------
 // Switch Darkmode 
-function askPiaEnableDarkmode() {
+function askToggleDarkmode() {
   // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_darkmode_noti');?>', '<?php echo lang('Maintenance_Tool_darkmode_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Switch');?>', 'PiaEnableDarkmode');
+  showModalWarning('<?= lang('Maintenance_Tool_darkmode_noti');?>', '<?= lang('Maintenance_Tool_darkmode_noti_text');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Switch');?>', 'ToggleDarkmode');
 }
-function PiaEnableDarkmode()
-{ 
-  // Execute
-  $.get('php/server/devices.php?action=PiaEnableDarkmode', function(msg) {
-    showMessage (msg);
-  });
-}
-
-// Toggle the Arp-Scans 
-function askPiaToggleArpScan () {
-  // Ask 
-  showModalWarning('<?php echo lang('Maintenance_Tool_arpscansw_noti');?>', '<?php echo lang('Maintenance_Tool_arpscansw_noti_text');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Switch');?>', 'PiaToggleArpScan');
-}
-function PiaToggleArpScan()
-{ 
-  // Execute
-  $.get('php/server/devices.php?action=PiaToggleArpScan', function(msg) {
-    showMessage (msg);
+
+// --------------------------------------------------------
+function ToggleDarkmode()
+{   
+  // get parameter Front_Dark_Mode_Enabled value
+  $.get('php/server/parameters.php?action=get&defaultValue=false&expireMinutes=525600&parameter=Front_Dark_Mode_Enabled', function(data) {
+  var result = JSON.parse(data);
+  if (result) {
+      darkModeEnabled = result == 'true';      
+
+      // invert value
+      darkModeEnabled = !darkModeEnabled;      
+
+      // save inverted value
+      $.get('php/server/parameters.php?action=set&parameter=Front_Dark_Mode_Enabled&expireMinutes=525600&value='+ darkModeEnabled,
+        function(data) {
+          if (data != "OK") {
+            showMessage (data);
+            setTimeout(function (){location.reload()}, 1000);
+            
+          } else {
+            showMessage (data);
+          };
+      } );
+      
+  }
   });
 }
 
+// --------------------------------------------------------
 
 // Clean log file 
 var targetLogFile = "";
 var logFileAction = "";
 
+
+// --------------------------------------------------------
+
 function logManage(callback) {
   targetLogFile = arguments[0];  // target
   logFileAction = arguments[1];  // action
   // Ask 
-  showModalWarning('<?php echo lang('Gen_Purge');?>' + ' ' + arguments[1], '<?php echo lang('Gen_AreYouSure');?>',
-    '<?php echo lang('Gen_Cancel');?>', '<?php echo lang('Gen_Okay');?>', "performLogManage");
+  showModalWarning('<?= lang('Gen_Purge');?>' + ' ' + arguments[1], '<?= lang('Gen_AreYouSure');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Okay');?>', "performLogManage");
 }
 
+// --------------------------------------------------------
 function performLogManage() { 
   // Execute
   console.log("targetLogFile:" + targetLogFile)
@@ -697,37 +702,103 @@ function performLogManage() {
   })
   }
 
+// --------------------------------------------------------
 function scrollDown()
 {
-  var tempArea = $('#pialert_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
+  var areaIDs = ['pialert_log', 'pialert_front_log', 'IP_changes_log', 'stdout_log', 'stderr_log', 'pialert_pholus_log',  'pialert_pholus_lastrun_log'];
+  
+  for (let i = 0; i < areaIDs.length; i++) {
 
-  tempArea = $('#pialert_front_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
-
-  tempArea = $('#IP_changes_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
-
-  tempArea = $('#stdout_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
-
-  tempArea = $('#stderr_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
-
-  tempArea = $('#pialert_pholus_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
-
-  tempArea = $('#pialert_pholus_lastrun_log');
-  $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
+    var tempArea = $('#' + areaIDs[i]);
+    
+    if (tempArea.length > 0)
+    {
+      $(tempArea[0]).scrollTop(tempArea[0].scrollHeight);
+    }
 
+  }
 }
 
+// --------------------------------------------------------
+// Manage displayed columns
+// --------------------------------------------------------
+colDefaultOrder = ['0','1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17'];
+colDefaultOrderTxt = '[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17]';
+
+
+function saveSelectedColumns () { 
+  $.get('php/server/parameters.php?action=set&expireMinutes=525600&value=['+ $('#columnsSelect').val().toString() +']&parameter=Front_Devices_Columns_Visible', function(data) {
+    // save full order of all columns to simplify mapping later on
+    
+    colDisplayed = $('#columnsSelect').val();
+    
+    colNewOrder = colDisplayed;
+
+    // append the remaining columns in the previous order
+    for(i = 0; i < colDefaultOrder.length; i++)
+    {
+      if(!colDisplayed.includes(colDefaultOrder[i]))
+      {
+        colNewOrder.push(colDefaultOrder[i])
+      }
+    }    
+
+    // save the setting in the DB
+    $.get('php/server/parameters.php?action=set&expireMinutes=525600&value=['+ colNewOrder.toString() +']&parameter=Front_Devices_Columns_Order', function(data) {
+
+      showMessage(data);
+
+    });
+  });
+}
+
+// --------------------------------------------------------
+function initializeSelectedColumns () { 
+  $.get('php/server/parameters.php?action=get&expireMinutes=525600&defaultValue='+colDefaultOrderTxt+'&parameter=Front_Devices_Columns_Visible', function(data) {
+
+    tableColumnShow = numberArrayFromString(data);
+
+    for(i=0; i < tableColumnShow.length; i++)
+    {
+      // create the option and append to Select2
+      var option = new Option($('#columnsSelect option[value='+tableColumnShow[i]+']').html(), tableColumnShow[i] , true, true);
+      
+      $("#columnsSelect").append(option).trigger('change');
+
+      $(option).attr('eee','eee')
+    }
+    
+  });
+} 
+
+// --------------------------------------------------------
+//Initialize Select2 Elements and make them sortable
+
+$(function () {    
+    selectEl = $('.select2').select2();
+   
+    selectEl.next().children().children().children().sortable({
+      containment: 'parent', stop: function (event, ui) {
+        ui.item.parent().children('[title]').each(function () {
+          var title = $(this).attr('title');
+          var original = $( 'option:contains(' + title + ')', selectEl ).first();
+          original.detach();
+          selectEl.append(original)
+        });
+        selectEl.change();
+      }
+    });
+});
+
+
+
+// --------------------------------------------------------
+// General initialization
+// --------------------------------------------------------
 function initializeTabs () {  
 
   key = "activeMaintenanceTab"
 
-  // --------------------------------------------------------
-
   // default selection
   selectedTab = "tab_Settings"
 
@@ -736,9 +807,8 @@ function initializeTabs () {
 
   // update cookie if target specified
   if(target != "")
-  {
-    // console.log(target)
-    setCache(key, target+'_id')
+  {    
+    setCache(key, target+'_id') // _id is added so it doesn't conflict with AdminLTE tab behavior
   }
 
   // get the tab id from the cookie (already overriden by the target)
@@ -748,10 +818,6 @@ function initializeTabs () {
   }
 
   // Activate panel
-  if(!emptyArr.includes(getCache(key)))
-  {
-    selectedTab = getCache(key);
-  }
   $('.nav-tabs a[id='+ selectedTab +']').tab('show');
 
   // When changed save new current tab
@@ -762,7 +828,7 @@ function initializeTabs () {
   // events on tab change
   $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
     var target = $(e.target).attr("href") // activated tab
-    //alert(target);
+    
     if(target == "#tab_Logging")
     {
       scrollDown();
@@ -770,6 +836,8 @@ function initializeTabs () {
   });
 }
 
+// --------------------------------------------------------
+
 // save language in a cookie
 $('#langselector').on('change', function (e) {
     var optionSelected = $("option:selected", this);
@@ -777,11 +845,13 @@ $('#langselector').on('change', function (e) {
     setCookie("language",valueSelected )
     location.reload();
   });
-
+// --------------------------------------------------------
 
 // load footer asynchronously not to block the page load/other sections
 window.onload = function asyncFooter()
 {
+  initializeSelectedColumns();
+
   scrollDown();
 
   initializeTabs();
@@ -795,5 +865,11 @@ window.onload = function asyncFooter()
 
 </script>
 
+<link rel="stylesheet" href="lib/AdminLTE/bower_components/select2/dist/css/select2.min.css">
+<script src="lib/AdminLTE/bower_components/select2/dist/js/select2.full.min.js"></script>
+<script src="lib/AdminLTE/bower_components/jquery-ui/jquery-ui.min.js"></script>
 
 
+
+<!-- ----------------------------------------------------------------------- -->
+<script src="js/pialert_common.js"></script>

front/network.php

@@ -1,8 +1,6 @@
 <?php
 
   require 'php/templates/header.php';
-  require 'php/server/db.php';
-  require 'php/server/util.php';
 
   // online / offline badges HTML snippets 
   define('badge_online', '<div class="badge bg-green text-white" style="width: 60px;">Online</div>');
@@ -20,16 +18,20 @@
   <section class="content-header">
   <?php require 'php/templates/notification.php'; ?>
     <h1 id="pageTitle">
-        <?php echo lang('Network_Title');?>
-    </h1>
+      <i class="fa fa-network-wired"></i> <?= lang('Network_Title');?>
+      <span class="networkPageHelp"> <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/NETWORK_TREE.md"><i class="fa fa-circle-question"></i></a><span>
+    </h1>    
   </section>
 
+
+
+  <div id="networkTree" ></div>
+
   <!-- Main content ---------------------------------------------------------- -->
   <section class="content">
     <?php
-
       // Create top-level node (network devices) tabs 
-      function createDeviceTabs($node_mac, $node_name, $node_status, $node_type, $node_ports_count, $activetab) {        
+      function createDeviceTabs($node_mac, $node_name, $node_status, $node_type, $node_ports_count, $icon, $activetab) {        
 
         // prepare string with port number in brackets if available
         $str_port = "";
@@ -46,11 +48,16 @@
         {
           $node_badge = circle_offline;
         }
-        
 
+        if($icon != '')
+        {
+          $icon = '<i class="fa fa-'.$icon.'"></i> ';
+        }
+        
+        $idFromMac = str_replace(":", "_", $node_mac);
         $str_tab_header = '<li class="'.$activetab.'">
-                              <a href="#'.str_replace(":", "_", $node_mac).'" data-toggle="tab" >'
-                                  .$node_name.' ' .$str_port.$node_badge.
+                              <a href="#'.$idFromMac.'" data-mytabmac="'.$node_mac.'" id="'.$idFromMac.'_id" data-toggle="tab" >' // _id is added so it doesn't conflict with AdminLTE tab behavior
+                                .$icon.$node_name.' ' .$str_port.$node_badge.
                               '</a>
                           </li>';
 
@@ -71,17 +78,29 @@
           $node_badge = badge_offline;
         }
 
-        $str_tab_pane = '<div class="tab-pane '.$activetab.'" id="'.str_replace(":", "_", $node_mac).'">
-                            <a href="./deviceDetails.php?mac='.$node_mac.'">
-                              <h4>'.$node_name.'</h4>
-                            </a>
-                            <table class="table table-striped" style="width:200px;"> 
+        $idFromMac = str_replace(":", "_", $node_mac);
+        $idParentMac = str_replace(":", "_", $node_parent_mac);
+        $str_tab_pane = '<div class="tab-pane '.$activetab.'" id="'.$idFromMac.'">
+                            <div>
+                              <h2 class="page-header"><i class="fa fa-server"></i> '.lang('Network_Node'). '</h2>
+                            </div>
+                            <table class="table table-striped" > 
                               <tbody>
                                 <tr> 
-                                  <td >
-                                    <b>MAC:</b>
+                                  <td class="col-sm-3">
+                                    <b>'.lang('Network_Node').'</b>
                                   </td>
-                                  <td class="anonymize">'
+                                  <td  class="anonymize">
+                                    <a href="./deviceDetails.php?mac='.$node_mac.'">
+                                    '.$node_name.'
+                                    </a>
+                                  </td>
+                                </tr>
+                                <tr> 
+                                  <td >
+                                    <b>MAC</b>
+                                  </td>
+                                  <td data-mynodemac="'.$node_mac.'" class="anonymize">'
                                     .$node_mac.
                                   '</td>
                                 </tr>
@@ -95,7 +114,7 @@
                                 </tr>
                                 <tr> 
                                   <td>
-                                    <b>'.lang('Network_Table_State').':</b> 
+                                    <b>'.lang('Network_Table_State').'</b> 
                                   </td>
                                   <td>  '
                                     .$node_badge.
@@ -103,29 +122,33 @@
                                 </tr>
                                 <tr> 
                                   <td>
-                                    <b>'.lang('DevDetail_MainInfo_Network').'</b> 
+                                    <b>'.lang('Network_Parent').'</b> 
                                   </td>
                                   <td>  
-                                    <a href="./deviceDetails.php?mac='.$node_parent_mac.'">
-                                      <b class="anonymize">'.$node_parent_mac.'</b>
+                                    <a href="./network.php?mac='.$idParentMac.'">
+                                      <b class="anonymize">'.$idParentMac.'  <i class="fa fa-square-up-right"></i></b>
                                     </a>                                 
                                   </td>
                               </tr>
                               </tbody>
                             </table>
                             <br>
-                             <div class="box-body no-padding">';
+                             <div id="assignedDevices"  class="box-body no-padding">
+                              <div class="page-header">
+                                <h3>
+                                  <i class="fa fa-sitemap"></i> '.lang('Network_Connected').'
+                                </h3>
+                              </div>
+                             ';
 
-        $str_table =      '   <h4>
-                              '.lang('Device_Title').'
-                              </h4>
-                              <table class="table table-striped">
+        $str_table =      '   <table class="table table-striped">
                                 <tbody>
                                 <tr>
-                                  <th style="width: 40px">Port</th>
-                                  <th style="width: 100px">'.lang('Network_Table_State').'</th>
-                                  <th>'.lang('Network_Table_Hostname').'</th>
-                                  <th>'.lang('Network_Table_IP').'</th>
+                                  <th class="col-sm-1" >Port</th>
+                                  <th class="col-sm-1" >'.lang('Network_Table_State').'</th>
+                                  <th class="col-sm-2" >'.lang('Network_Table_Hostname').'</th>
+                                  <th class="col-sm-1" >'.lang('Network_Table_IP').'</th>
+                                  <th class="col-sm-3" >'.lang('Network_ManageLeaf').'</th>
                                 </tr>';
         
         // Prepare Array for Devices with Port value
@@ -204,6 +227,9 @@
                               <td class="anonymize">'
                                 .$row['last_ip'].
                               '</td>
+                              <td class="">
+                                <button class="btn btn-primary btn-danger btn-sm" data-myleafmac="'.$row['mac'].'" >'.lang('Network_ManageUnassign').'</button>
+                              </td>
                             </tr>';
           
         }        
@@ -214,13 +240,9 @@
         // no connected device - don't render table, just display some info
         if($str_table_rows == "")
         {
-          $str_table = "<div>
-                          <h4>
-                            ".lang('Device_Title')."
-                          </h4>
+          $str_table = "<div>                        
                           <div>
-                            This network device (node) doesn't have any assigned devices (leaf nodes).                             
-                            Go to <a href='devices.php'><b>".lang('Device_Title')."</b></a>, select a device you want to attach to this node and assign it in the <b>Details</b> tab by selecting it in the <b>".lang('DevDetail_MainInfo_Network') ."</b> dropdown.
+                            ".lang("Network_NoAssignedDevices")."
                           </div>
                         </div>";
           $str_table_close = "";
@@ -247,16 +269,17 @@
     //                          \
     //                          PC (leaf)
     
-    $sql = "SELECT node_name, node_mac, online, node_type, node_ports_count, parent_mac
+    $sql = "SELECT node_name, node_mac, online, node_type, node_ports_count, parent_mac, node_icon
             FROM 
             (
                   SELECT  a.dev_Name as  node_name,        
                         a.dev_MAC as node_mac,
                         a.dev_PresentLastScan as online,
                         a.dev_DeviceType as node_type,
-                        a.dev_Network_Node_MAC_ADDR as parent_mac
+                        a.dev_Network_Node_MAC_ADDR as parent_mac,
+                        a.dev_Icon as node_icon
                   FROM Devices a 
-                  WHERE a.dev_DeviceType in ('AP', 'Gateway', 'Powerline', 'Switch', 'WLAN', 'PLC', 'Router','USB LAN Adapter', 'USB WIFI Adapter', 'Internet')					
+                  WHERE a.dev_DeviceType in ('AP', 'Gateway', 'Firewall', 'Powerline', 'Switch', 'WLAN', 'PLC', 'Router','USB LAN Adapter', 'USB WIFI Adapter', 'Internet')					
             ) t1
             LEFT JOIN
             (
@@ -279,7 +302,8 @@
                               'online'                  => $row['online'],
                               'node_type'               => $row['node_type'],
                               'parent_mac'              => $row['parent_mac'],
-                              'node_ports_count'        => $row['node_ports_count']); 
+                              'node_icon'               => $row['node_icon'],
+                              'node_ports_count'        => $row['node_ports_count']);
     }
 
     // Control no rows
@@ -290,13 +314,14 @@
     echo '<div class="nav-tabs-custom" style="margin-bottom: 0px;">
     <ul class="nav nav-tabs">';
 
-    $activetab='active';                    
+    $activetab='active';
     foreach ($tableData as $row) {                            
         createDeviceTabs( $row['node_mac'], 
                           $row['node_name'], 
                           $row['online'],
                           $row['node_type'], 
                           $row['node_ports_count'],
+                          $row['node_icon'],
                           $activetab);
 
                           $activetab = ""; // reset active tab indicator, only the first tab is active
@@ -318,8 +343,6 @@
                   $activetab = ""; // reset active tab indicator, only the first tab is active
     
     }
-                              
-    commitDB ();
 
     ?>
     <!-- /.tab-pane -->
@@ -335,7 +358,7 @@
                         dev_Name as name,                        
                         dev_LastIP as last_ip,
                         dev_Network_Node_MAC_ADDR
-                    FROM Devices WHERE (dev_Network_Node_MAC_ADDR is null or dev_Network_Node_MAC_ADDR = "" or dev_Network_Node_MAC_ADDR = " " ) and dev_MAC not like "%internet%" order by name asc'; 
+                    FROM Devices WHERE (dev_Network_Node_MAC_ADDR is null or dev_Network_Node_MAC_ADDR = "" or dev_Network_Node_MAC_ADDR = " " or dev_Network_Node_MAC_ADDR = "undefined") and dev_MAC not like "%internet%" order by name asc'; 
 
     global $db;
     $func_result = $db->query($func_sql);  
@@ -354,17 +377,19 @@
     if (!(empty($tableData))) {
       $str_table_header =  '
                         <div class="content">
-                          <div class="box box-aqua box-body">
+                          <div id="unassignedDevices" class="box box-aqua box-body">
                             <section> 
-                              <h4>
-                                '.lang('Network_UnassignedDevices').'
-                              </h4>
+                              <h3>
+                                <i class="fa fa-laptop"></i> '.lang('Network_UnassignedDevices').'
+                              </h3>
                               <table class="table table-striped">
                                 <tbody>
                                 <tr>                              
-                                  <th style="width: 100px">'.lang('Network_Table_State').'</th>
-                                  <th>'.lang('Network_Table_Hostname').'</th>
-                                  <th>'.lang('Network_Table_IP').'</th>
+                                  <th  class="col-sm-1" ></th>
+                                  <th  class="col-sm-1" >'.lang('Network_Table_State').'</th>
+                                  <th  class="col-sm-2" >'.lang('Network_Table_Hostname').'</th>
+                                  <th  class="col-sm-1" >'.lang('Network_Table_IP').'</th>
+                                  <th  class="col-sm-3" >'.lang('Network_Assign').'</th>
                                 </tr>';   
 
       $str_table_rows = "";        
@@ -378,7 +403,9 @@
         }
 
         $str_table_rows = $str_table_rows.
-                                          '<tr>                  
+                                          '
+                                          <tr>                  
+                                            <td> </td> 
                                             <td>'
                                               .$state.
                                             '</td>
@@ -389,9 +416,11 @@
                                             </td>
                                             <td>'
                                               .$row['last_ip'].
-                                            '</td>
+                                            '</td>                                            
+                                            <td>
+                                            <button class="btn btn-primary btn-sm" data-myleafmac="'.$row['mac'].'" >'.lang('Network_ManageAssign').'</button>
+                                          </td>
                                           </tr>';
-
       }        
 
       $str_table_close =    '</tbody>
@@ -404,14 +433,343 @@
       echo $str_table_header.$str_table_rows.$str_table_close;     
     }
 
-    CommitDB ();
-  ?>
 
+  ?>
+    
     <!-- /.content -->
   </div>
   <!-- /.content-wrapper -->
 
 <!-- ----------------------------------------------------------------------- -->
+
+
+
 <?php
   require 'php/templates/footer.php';
 ?>
+
+<script src="lib/treeviz/index.js"></script>
+<script src="lib/treeviz/require.js"></script>
+<script src="js/pialert_common.js"></script>
+
+<script>
+  $.get('php/server/devices.php?action=getDevicesList&status=all&forceDefaultOrder', function(data) {     
+
+      rawData = JSON.parse (data)      
+
+      devicesListnew = rawData["data"].map(item =>  { return {
+                                                              "name":item[0], 
+                                                              "type":item[2], 
+                                                              "icon":item[3], 
+                                                              "mac":item[11], 
+                                                              "parentMac":item[14], 
+                                                              "rowid":item[13], 
+                                                              "status":item[10],
+                                                              "childrenQty":item[15]
+                                                              }})
+
+      setCache('devicesListNew', JSON.stringify(devicesListnew))
+
+      // create tree
+      initTree(getHierarchy());
+
+      // attach on-click events
+      attachTreeEvents();
+    });
+</script>
+
+
+<script defer>
+  // ---------------------------------------------------------------------------
+  // Tree functionality
+  // ---------------------------------------------------------------------------
+  // ---------------------------------------------------------------------------  
+  function getDevicesList()
+  {
+    // Read cache
+    devicesList = getCache('devicesListNew');
+    
+    if (devicesList != '') {
+        devicesList = JSON.parse (devicesList);
+    } else {
+        devicesList = [];
+    }
+    return devicesList;
+  }
+
+  
+  // ---------------------------------------------------------------------------
+  var leafNodesCount = 0;
+  var visibleNodesCount = 0;
+  var parentNodesCount = 0;
+  var hiddenMacs = []; // hidden children
+  var hiddenChildren = [];
+  
+
+  
+
+  // ---------------------------------------------------------------------------
+  function getChildren(node, list, path)
+  {
+    var children = [];
+
+    // loop thru all items and find childern...
+    for(var i in list)
+    {
+      //... of the current node
+      if(list[i].parentMac == node.mac && !hiddenMacs.includes(list[i].parentMac))
+      {   
+        visibleNodesCount++
+
+        // and process them 
+        children.push(getChildren(list[i], list, path + ((path == "") ? "" : '|') + list[i].parentMac, hiddenMacs))
+
+      }
+    }
+
+    // note the total number of leaf nodes to calculate the font scaling
+    if(children.length == 0) 
+    { 
+      leafNodesCount++ 
+    } else
+    {
+      parentNodesCount++
+    }  
+
+    
+    return { 
+      name: node.name,      
+      path: path,
+      mac: node.mac,
+      id: node.mac,
+      parentMac: node.parentMac,
+      icon: node.icon,
+      type: node.type,
+      status: node.status,
+      hasChildren: children.length > 0 || hiddenMacs.includes(node.mac),
+      hiddenChildren: hiddenMacs.includes(node.mac),
+      qty: children.length,
+      children:  children
+    };
+        
+  }
+
+  // ---------------------------------------------------------------------------
+  
+  function getHierarchy()
+  {    
+    list = getDevicesList();
+    
+    for(i in list)
+    {      
+      if(list[i].mac == 'Internet')
+      { 
+        return (getChildren(list[i], list, ''))
+        break;
+      }
+    }
+  }
+
+
+  // ---------------------------------------------------------------------------
+  function toggleSubTree(parentMac, treePath)
+  {
+    treePath = treePath.split('|')
+
+    if(!hiddenMacs.includes(parentMac))
+    {
+      hiddenMacs.push(parentMac)
+    }
+    else
+    {
+      removeItemFromArray(hiddenMacs, parentMac)
+    }
+
+    list = getDevicesList();
+
+    // updatedTree = myHierarchy;
+    updatedTree = getHierarchy()
+
+    myTree.refresh(updatedTree);
+
+    // re-attach any onclick events
+    attachTreeEvents();   
+  }
+  
+  // --------------------------------------------------------------------------- 
+  function attachTreeEvents()
+  {
+    //  toggle subtree functionality
+    $("div[data-mytreemac]").each(function(){
+        $(this).attr('onclick', 'toggleSubTree("'+$(this).attr('data-mytreemac')+'","'+ $(this).attr('data-mytreepath')+'")')        
+    }); 
+  }
+
+  // --------------------------------------------------------------------------- 
+  var myTree;
+  var treeAreaHeight = 600;
+  var emSize;
+  var nodeHeight;
+
+  function initTree(myHierarchy)
+  {    
+    // calculate the font size of the leaf nodes to fit everything into the tree area
+    leafNodesCount == 0 ? 1 : leafNodesCount;
+    emSize = ((600/(20*leafNodesCount)).toFixed(2));        
+    emSize = emSize > 1 ? 1 : emSize;      
+    
+    nodeHeight = ((emSize*100*0.30).toFixed(0))
+
+    $("#networkTree").attr('style', `height:${treeAreaHeight}px; width:${$('.content-header').width()}px`)
+
+    myTree = Treeviz.create({
+      htmlId: "networkTree",
+      
+      renderNode:  nodeData =>  { 
+        var fontSize = "font-size:"+emSize+"em;";
+
+        deviceIcon = (!emptyArr.includes(nodeData.data.icon )) ?  "<div class='netIcon ' ><i class='fa fa-"+nodeData.data.icon +"'></i></div>"    : "";
+        collapseExpandIcon = nodeData.data.hiddenChildren ?  "square-plus" :"square-minus";
+        collapseExpandHtml = (nodeData.data.hasChildren) ?  "<div class='netCollapse' style='font-size:"+emSize*2.5+"em;' data-mytreepath='"+nodeData.data.path+"' data-mytreemac='"+nodeData.data.mac+"'><i class='fa fa-"+ collapseExpandIcon +" pointer'></i></div>"    : "";
+        statusCss = " netStatus-" + nodeData.data.status;
+
+        selectedNodeMac = $(".nav-tabs-custom .active a").attr('data-mytabmac')
+
+        highlightedCss = nodeData.data.mac == selectedNodeMac ? " highlightedNode" : "";        
+
+        return result = "<div class='box "+statusCss+" "+highlightedCss+"'  data-mytreemacmain='"+nodeData.data.mac+"' \
+                          style='height:"+nodeData.settings.nodeHeight+"px;\
+                                 width:180px;\
+                                 display:flex;\
+                                 flex-direction:column;\
+                                 justify-content:center;\
+                                 " + fontSize + "\
+                                 align-items:center;\
+                                 border-radius:5px;'\
+                          >\
+                          <div class='netNodeText '>\
+                            <strong>" + deviceIcon +
+                              "<span class='spanNetworkTree anonymizeDev'>"+nodeData.data.name+"</span>\
+                            </strong>"
+                            +collapseExpandHtml+ 
+                          "</div></div>";
+        },
+
+      onNodeClick:  nodeData =>  { 
+          // console.log(this)  
+        },
+      mainAxisNodeSpacing: 'auto',
+      // mainAxisNodeSpacing: 3,
+      secondaryAxisNodeSpacing: 0.3,
+      nodeHeight: nodeHeight.toString(),    
+      marginTop: '5',
+      hasZoom: false,
+      hasPan: false,
+      // marginLeft: '15',
+      idKey: "id",
+      hasFlatData: false,      
+      linkWidth: (nodeData) => 3,
+      relationnalField: "children",      
+      });
+      
+      myTree.refresh(myHierarchy);      
+    }
+
+  // ---------------------------------------------------------------------------
+  // Tabs functionality
+  // ---------------------------------------------------------------------------
+  // Register events on tab change
+  
+  $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {   
+
+    initButtons()
+
+  });
+
+
+  // ---------------------------------------------------------------------------
+  function initTab()
+  {
+    key = "activeNetworkTab"
+
+    // default selection
+    selectedTab = "Internet_id"
+
+    // the #target from the url
+    target = getQueryString('mac') 
+
+    // update cookie if target specified
+    if(target != "")
+    {      
+      setCache(key, target.replaceAll(":","_")+'_id') // _id is added so it doesn't conflict with AdminLTE tab behavior
+    }
+
+    // get the tab id from the cookie (already overriden by the target)
+    if(!emptyArr.includes(getCache(key)))
+    {
+      selectedTab = getCache(key);
+    }
+
+    // Activate panel
+    $('.nav-tabs a[id='+ selectedTab +']').tab('show');
+
+    // When changed save new current tab
+    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+      setCache(key, $(e.target).attr('id'))
+    });
+    
+  }
+
+  // ---------------------------------------------------------------------------
+  function initButtons()
+  { 
+
+    var currentNodeMac = $(".tab-content .active td[data-mynodemac]").attr('data-mynodemac'); 
+
+    // change highlighted node in the tree
+    selNode = $("#networkTree .highlightedNode")[0]
+
+    // console.log(selNode)
+
+    if(selNode)
+    {
+      $(selNode).attr('class',  $(selNode).attr('class').replace('highlightedNode'))
+    }
+
+    newSelNode = $("#networkTree div[data-mytreemacmain='"+currentNodeMac+"']")[0]
+    
+    $(newSelNode).attr('class',  $(newSelNode).attr('class') + ' highlightedNode')
+
+
+    // init the Assign buttons
+    $('#unassignedDevices  button[data-myleafmac]').each(function(){
+      $(this).attr('onclick', 'updateLeaf("'+$(this).attr('data-myleafmac')+'","'+currentNodeMac+'")')
+    }); 
+
+    // init Unassign buttons
+    $('#assignedDevices button[data-myleafmac]').each(function(){
+      $(this).attr('onclick', 'updateLeaf("'+$(this).attr('data-myleafmac')+'","")')
+    }); 
+  }
+
+  // ---------------------------------------------------------------------------
+  function updateLeaf(leafMac,nodeMac)
+  {
+    console.log(leafMac)
+    console.log(nodeMac)
+    saveData('updateNetworkLeaf', leafMac, nodeMac);
+    setTimeout("location.reload();", 1000); // refresh page after 1s
+  }
+
+
+  // init selected (first) tab
+  initTab();  
+
+  // init Assign/Unassign buttons
+  initButtons()
+
+
+</script>
+
+
+

front/php/server/db.php

@@ -8,11 +8,9 @@
 #  Puche 2021 / 2022+ jokob             jokob@duck.com                GNU GPLv3
 //------------------------------------------------------------------------------
 
-require '/home/pi/pialert/front/php/templates/timezone.php';
-
 //------------------------------------------------------------------------------
 // DB File Path
-$DBFILE = '/home/pi/pialert/db/pialert.db';
+$DBFILE = dirname(__FILE__).'/../../../db/pialert.db';
 
 //------------------------------------------------------------------------------
 // Connect DB
@@ -70,15 +68,7 @@ function OpenDB (...$DBPath) {
   $db->exec('PRAGMA journal_mode = wal;');
 }
 
-function CommitDB () {
-  global $db;
-  
-  // $db->commit();
-}
 
 // # Open DB once and keep open
 // # Opening / closing DB frequently actually casues more issues
 OpenDB (); // main
-
-   
-?>

front/php/server/dbHelper.php

@@ -0,0 +1,193 @@
+<?php
+//------------------------------------------------------------------------------
+//  Pi.Alert
+//  Open Source Network Guard / WIFI & LAN intrusion detector 
+//
+//  parameters.php - Front module. Server side. Manage Parameters
+//------------------------------------------------------------------------------
+#  Puche 2022+ jokob             jokob@duck.com                GNU GPLv3
+//------------------------------------------------------------------------------
+
+
+//------------------------------------------------------------------------------
+  // External files
+  require dirname(__FILE__).'/init.php';
+ 
+
+//------------------------------------------------------------------------------
+//  Action selector
+//------------------------------------------------------------------------------
+  // Set maximum execution time to 15 seconds
+  ini_set ('max_execution_time','15');
+
+  $skipCache = FALSE;
+  $expireMinutes = 5;
+  $defaultValue = '';
+  $dbtable = '';
+  $columns = '';
+  $values  = '';
+  
+
+  if (isset ($_REQUEST['skipcache'])) {
+    $skipCache = TRUE;    
+  }
+
+  if (isset ($_REQUEST['defaultValue'])) {
+    $defaultValue = $_REQUEST['defaultValue'];    
+  }
+
+  if (isset ($_REQUEST['expireMinutes'])) {
+    $expireMinutes = $_REQUEST['expireMinutes'];    
+  }
+
+  if (isset ($_REQUEST['columnName'])) {
+    $columnName = $_REQUEST['columnName'];    
+  }
+
+  if (isset ($_REQUEST['id'])) {
+    $id = $_REQUEST['id'];    
+  }
+
+  if (isset ($_REQUEST['values'])) {
+    $values = $_REQUEST['values'];    
+  }
+
+  if (isset ($_REQUEST['columns'])) {
+    $columns = $_REQUEST['columns'];    
+  }
+
+  if (isset ($_REQUEST['dbtable'])) {
+    $dbtable = $_REQUEST['dbtable'];    
+  }
+  // TODO: Security, read, delete, edge cases
+  // Action functions
+  if (isset ($_REQUEST['action']) && !empty ($_REQUEST['action'])) {
+    $action = $_REQUEST['action'];
+    switch ($action) {
+      case 'create':    create($skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values ); break;
+      // case 'read'  :    read($skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values);    break;
+      case 'update':    update($columnName, $id, $skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values);  break;
+      case 'delete':    delete($columnName, $id, $dbtable);  break;
+      default:     logServerConsole ('Action: '. $action);  break;
+    }
+  }
+
+
+//------------------------------------------------------------------------------
+//  update
+//------------------------------------------------------------------------------
+function update($columnName, $id, $skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values) {
+
+  global $db;  
+
+  // handle one or multiple columns
+  if(strpos($columns, ',') !== false) 
+  {
+    $columnsArr = explode(",", $columns);
+  }else
+  {
+    $columnsArr = array($columns);
+  }
+
+  // handle one or multiple values
+  if(strpos($values, ',') !== false)
+  {
+    $valuesArr = explode(",", $values);
+  } else
+  {
+    $valuesArr = array($values);
+  }
+
+  $columnValues = '';
+
+  $index = 0;
+  foreach($columnsArr as $column)
+  {
+    $columnValues =  $columnValues .' "' .$column.'" = "'.$valuesArr[$index] . '",' ;
+    $index = $index + 1;
+  }
+  
+  $columnValues = substr($columnValues, 0, -1);  
+ 
+  // Update value
+  $sql = 'UPDATE '.$dbtable.' SET '. $columnValues .'
+          WHERE "'. $columnName .'"="'. $id.'"';
+  $result = $db->query($sql);
+
+  if (! $result == TRUE) {
+    echo "Error updating parameter\n\n$sql \n\n". $db->lastErrorMsg();
+    return;
+  }
+
+  $changes = $db->changes();
+  if ($changes == 0) {
+    // Insert new value
+    create($skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values);
+  }
+
+  // update cache  
+  $uniqueHash = hash('ripemd160', $dbtable . $columns);
+  setCache($uniqueHash, $values, $expireMinutes);
+
+  echo 'OK';  
+}
+
+
+//------------------------------------------------------------------------------
+//  create
+//------------------------------------------------------------------------------
+function create($skipCache, $defaultValue, $expireMinutes, $dbtable, $columns, $values)
+{
+  global $db;
+
+  // Insert new value
+  $sql = 'INSERT INTO '.$dbtable.' ('.$columns.')
+          VALUES ("'. quotes($parameter) .'",
+                  "'. $values     .'")';
+  $result = $db->query($sql);
+
+  if (! $result == TRUE) {
+    echo "Error creating entry\n\n$sql \n\n". $db->lastErrorMsg();
+    return;
+  }
+}
+
+//------------------------------------------------------------------------------
+//  delete
+//------------------------------------------------------------------------------
+function delete($columnName, $id, $dbtable)
+{
+  global $db;
+
+  // handle one or multiple ids
+  if(strpos($id, ',') !== false) 
+  {
+    $idsArr = explode(",", $id);
+  }else
+  {
+    $idsArr = array($id);
+  }
+
+  $idsStr = "";
+  
+  foreach ($idsArr as $item) 
+  {
+    $idsStr = $idsStr . '"' .$item.'"';
+  }
+
+  // Insert new value
+  $sql = 'DELETE FROM '.$dbtable.' WHERE "'.$columnName.'" IN ('. $idsStr .')';
+  $result = $db->query($sql);
+
+  if (! $result == TRUE) {
+    echo "Error deleting entry\n\n$sql \n\n". $db->lastErrorMsg();
+    return;
+  } else
+  {
+    echo lang('Gen_DataUpdatedUITakesTime');
+    return;
+  }
+}
+
+
+?>

front/php/server/devices.php

@@ -9,15 +9,13 @@
 //------------------------------------------------------------------------------
 
   // External files
-  require '/home/pi/pialert/front/php/templates/timezone.php';
-  require '/home/pi/pialert/front/php/templates/language/lang.php';
-  require '/home/pi/pialert/front/php/server/db.php';
-  require '/home/pi/pialert/front/php/server/util.php';  
+  require dirname(__FILE__).'/init.php';
 
-//------------------------------------------------------------------------------
-//  Action selector
-//------------------------------------------------------------------------------
+  //------------------------------------------------------------------------------
+  //  Action selector
+  //------------------------------------------------------------------------------
   // Set maximum execution time to 15 seconds
+
   ini_set ('max_execution_time','30');
 
   // Action functions
@@ -41,9 +39,7 @@
       case 'deleteDeviceEvents':      deleteDeviceEvents();                    break;
       case 'PiaBackupDBtoArchive':    PiaBackupDBtoArchive();                  break;
       case 'PiaRestoreDBfromArchive': PiaRestoreDBfromArchive();               break;
-      case 'PiaPurgeDBBackups':       PiaPurgeDBBackups();                     break;
-      case 'PiaEnableDarkmode':       PiaEnableDarkmode();                     break;
-      case 'PiaToggleArpScan':        PiaToggleArpScan();                      break; 
+      case 'PiaPurgeDBBackups':       PiaPurgeDBBackups();                     break;             
       case 'ExportCSV':               ExportCSV();                             break;    
       case 'ImportCSV':               ImportCSV();                             break;     
 
@@ -58,12 +54,17 @@
       case 'getPholus':               getPholus();                             break;
       case 'getNmap':                 getNmap();                               break;
       case 'saveNmapPort':            saveNmapPort();                          break;
+      case 'updateNetworkLeaf':       updateNetworkLeaf();                     break;
+      case 'overwriteIconType':       overwriteIconType();                     break;
+      case 'getIcons':                getIcons();                              break;
+      case 'getActions':              getActions();                            break;
+      case 'wakeonlan':               wakeonlan();                             break;
 
       default:                        logServerConsole ('Action: '. $action);  break;
     }
   }
 
-  CommitDB();
+ 
 
 //------------------------------------------------------------------------------
 //  Query Device Data
@@ -153,6 +154,7 @@ function setDeviceData() {
                  dev_Owner                  = "'. quotes($_REQUEST['owner'])        .'",
                  dev_DeviceType             = "'. quotes($_REQUEST['type'])         .'",
                  dev_Vendor                 = "'. quotes($_REQUEST['vendor'])       .'",
+                 dev_Icon                   = "'. quotes($_REQUEST['icon'])         .'",
                  dev_Favorite               = "'. quotes($_REQUEST['favorite'])     .'",
                  dev_Group                  = "'. quotes($_REQUEST['group'])        .'",
                  dev_Location               = "'. quotes($_REQUEST['location'])     .'",
@@ -479,34 +481,41 @@ function ImportCSV() {
 
     // sql
     $sql = 'DELETE FROM Devices';
+
     // execute sql
     $result = $db->query($sql);    
 
-    // Open the CSV file with read-only mode
-    $csvFile = fopen($file, 'r');
-
-    // Skip the first line
-    fgetcsv($csvFile);
+    $data = file_get_contents($file); 
+    $data = explode("\n", $data); 
 
     $columns = getDevicesColumns();
 
-    // Parse data from CSV file line by line (max 10000 lines)
-    while (($row = fgetcsv($csvFile, 10000, ",")) !== FALSE)
+    
+    // Parse data from CSV file line by line (max 10000 lines)    
+    foreach($data as $row)
     {
-      $sql = 'INSERT INTO Devices ('.implode(',', $columns).') VALUES ("' .implode('","', $row).'")';
+      // Check if not empty and skipping first line      
+      $rowArray = explode(',',$row);
 
-      $result = $db->query($sql);
-
-      // check result
-      if ($result != TRUE) {
-        $error = $db->lastErrorMsg();
-        // break the while loop on error
-        break;
-      } 
+      if(count($rowArray) > 20)
+      {
+        $cleanMac = str_replace("\"","",$rowArray[0]);
+        
+        if(filter_var($cleanMac , FILTER_VALIDATE_MAC) == True || $cleanMac == "Internet")
+        {
+          $sql = "INSERT INTO Devices (".implode(',', $columns).") VALUES (" . $row.")";         
+          $result = $db->query($sql);
+          
+          // check result
+          if ($result != TRUE) {
+            $error = $db->lastErrorMsg();
+            // break the while loop on error
+            break;
+          } 
+        }
+      }
+      
     }
-
-    // Close opened CSV file
-    fclose($csvFile);
    
     if($error == "")
     {
@@ -516,35 +525,15 @@ function ImportCSV() {
     }
     else{
       // an error occurred while writing to the DB, display the last error message 
-      echo lang('BackDevices_DBTools_ImportCSVError')."\n\n$sql \n\n".$error;
+      echo lang('BackDevices_DBTools_ImportCSVError')."\n\n$sql \n\n".$result;
     }
     
    } else {
     echo lang('BackDevices_DBTools_ImportCSVMissing');    
    }
 
-
-   CommitDB();
-
 }
 
-//------------------------------------------------------------------------------
-//  Toggle Dark/Light Themes
-//------------------------------------------------------------------------------
-function PiaEnableDarkmode() {
-  $file = '../../../db/setting_darkmode';  
-
-  if (file_exists($file)) {
-      echo lang('BackDevices_darkmode_disabled');
-      unlink($file);
-      echo("<meta http-equiv='refresh' content='1'>");
-     } else {
-      echo lang('BackDevices_darkmode_enabled');
-      $darkmode = fopen($file, 'w');
-      echo("<meta http-equiv='refresh' content='1'>");
-     }
-  }
-
 //------------------------------------------------------------------------------
 //  Query total numbers of Devices by status
 //------------------------------------------------------------------------------
@@ -587,35 +576,110 @@ function getDevicesTotals() {
 function getDevicesList() {
   global $db;
 
+  $forceDefaultOrder = FALSE;
+
+  if (isset ($_REQUEST['forceDefaultOrder']) )
+  {
+    $forceDefaultOrder = TRUE;
+  }
+
+  // This object is used to map from the old order ( second parameter, first number) to the new mapping, that is represented by the 3rd parameter (Second number)
+  $columnOrderMapping = array(
+    array("dev_Name", 0, 0),               
+    array("dev_Owner", 1, 1),              
+    array("dev_DeviceType", 2, 2),         
+    array("dev_Icon", 3, 3),               
+    array("dev_Favorite", 4, 4),           
+    array("dev_Group", 5, 5),              
+    array("dev_FirstConnection", 6, 6),    
+    array("dev_LastConnection", 7, 7),     
+    array("dev_LastIP", 8, 8),             
+    array("dev_MAC", 9, 9),                
+    array("dev_Status", 10, 10),            
+    array("dev_MAC_full", 11, 11),          
+    array("dev_LastIP_orderable", 12, 12),  
+    array("rowid", 13, 13),            
+    array("dev_Network_Node_MAC_ADDR", 14, 14),
+    array("connected_devices", 15, 15),
+    array("dev_Location", 16, 16),
+    array("dev_Vendor", 17, 17)           
+  );
+
+  if($forceDefaultOrder == FALSE) 
+  {
+    // get device columns order
+    $sql = 'SELECT par_Value FROM Parameters  where par_ID = "Front_Devices_Columns_Order"';
+    $result = $db->query($sql);
+    $row = $result -> fetchArray (SQLITE3_NUM);  
+
+    if($row != NULL && count($row) == 1)
+    {
+      // ordered columns setting from the maintenance page
+      $orderedColumns = createArray($row[0]);
+
+      // init ordered columns    
+      for($i = 0; $i < count($orderedColumns); $i++) { 
+
+        $columnOrderMapping[$i][2] = $orderedColumns[$i];        
+      }
+
+    }
+  }
+
   // SQL
   $condition = getDeviceCondition ($_REQUEST['status']);
 
-  $sql = 'SELECT rowid, *, CASE
-            WHEN dev_AlertDeviceDown=1 AND dev_PresentLastScan=0 THEN "Down"
-            WHEN dev_NewDevice=1 THEN "New"
-            WHEN dev_PresentLastScan=1 THEN "On-line"
-            ELSE "Off-line"
-          END AS dev_Status
-          FROM Devices '. $condition;
-  $result = $db->query($sql);
+  $sql = 'SELECT * FROM (
+              SELECT rowid, *, CASE
+                      WHEN t1.dev_AlertDeviceDown=1 AND t1.dev_PresentLastScan=0 THEN "Down"
+                      WHEN t1.dev_NewDevice=1 THEN "New"
+                      WHEN t1.dev_PresentLastScan=1 THEN "On-line"
+                      ELSE "Off-line"  END AS dev_Status
+                      FROM Devices t1 '.$condition.') t3  
+                    LEFT JOIN
+                              (
+                                    SELECT dev_Network_Node_MAC_ADDR as dev_Network_Node_MAC_ADDR_t2, dev_MAC as dev_MAC_t2,
+                                          count() as connected_devices 
+                                    FROM Devices b 
+                                    WHERE b.dev_Network_Node_MAC_ADDR NOT NULL group by b.dev_Network_Node_MAC_ADDR
+                              ) t2
+                              ON (t3.dev_MAC = t2.dev_Network_Node_MAC_ADDR_t2);';
 
+  $result = $db->query($sql);
+  
   // arrays of rows
   $tableData = array();
   while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {
-    $tableData['data'][] = array ($row['dev_Name'],
-                                  $row['dev_Owner'],
-                                  $row['dev_DeviceType'],
-                                  $row['dev_Favorite'],
-                                  $row['dev_Group'],
-                                  formatDate ($row['dev_FirstConnection']),
-                                  formatDate ($row['dev_LastConnection']),
-                                  $row['dev_LastIP'],
-                                  ( in_array($row['dev_MAC'][1], array("2","6","A","E","a","e")) ? 1 : 0),
-                                  $row['dev_Status'],
-                                  $row['dev_MAC'], // MAC (hidden)
-                                  formatIPlong ($row['dev_LastIP']), // IP orderable
-                                  $row['rowid'] // Rowid (hidden)
-                                 );
+
+    $defaultOrder = array ($row['dev_Name'],
+                            $row['dev_Owner'],
+                            handleNull($row['dev_DeviceType']),
+                            handleNull($row['dev_Icon'], "laptop"),
+                            $row['dev_Favorite'],
+                            $row['dev_Group'],
+                            formatDate ($row['dev_FirstConnection']),
+                            formatDate ($row['dev_LastConnection']),
+                            $row['dev_LastIP'],
+                            ( in_array($row['dev_MAC'][1], array("2","6","A","E","a","e")) ? 1 : 0),
+                            $row['dev_Status'],
+                            $row['dev_MAC'], // MAC (hidden)
+                            formatIPlong ($row['dev_LastIP']), // IP orderable
+                            $row['rowid'], // Rowid (hidden)      
+                            handleNull($row['dev_Network_Node_MAC_ADDR']),
+                            handleNull($row['connected_devices']),
+                            handleNull($row['dev_Location']), 
+                            handleNull($row['dev_Vendor'])                            
+                          );
+
+    $newOrder = array();
+
+    // reorder columns based on user settings
+    for($index = 0; $index  < count($columnOrderMapping); $index++)
+    {
+      array_push($newOrder, $defaultOrder[$columnOrderMapping[$index][2]]);      
+    }
+
+    $tableData['data'][] = $newOrder;
   }
 
   // Control no rows
@@ -695,7 +759,7 @@ function getNetworkNodes() {
   global $db;
 
   // Device Data
-  $sql = 'SELECT * FROM Devices WHERE dev_DeviceType in (  "AP", "Gateway", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter")';
+  $sql = 'SELECT * FROM Devices WHERE dev_DeviceType in (  "AP", "Gateway", "Firewall", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter")';
 
   $result = $db->query($sql);
 
@@ -716,6 +780,45 @@ function getNetworkNodes() {
   echo (json_encode ($tableData));
 }
 
+//------------------------------------------------------------------------------
+function getIcons() {
+  global $db;
+
+  // Device Data
+  $sql = 'select dev_Icon from Devices group by dev_Icon';
+
+  $result = $db->query($sql);
+
+  // arrays of rows
+  $tableData = array();
+  while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {  
+    $icon = handleNull($row['dev_Icon'], "laptop"); 
+    // Push row data
+    $tableData[] = array('id'    => $icon, 
+                         'name'  => '<i class="fa fa-'.$icon.'"></i> - '.$icon );                          
+  }
+  
+  // Control no rows
+  if (empty($tableData)) {
+    $tableData = [];
+  }
+  
+    // Return json
+  echo (json_encode ($tableData));
+}
+
+//------------------------------------------------------------------------------
+function getActions() {
+  
+  $tableData = array(
+    array('id'    => 'wake-on-lan', 
+          'name'  =>  lang('DevDetail_WOL_Title'))
+  );
+
+  // Return json
+  echo (json_encode ($tableData));
+}
+
 
 //------------------------------------------------------------------------------
 //  Query the List of types
@@ -733,7 +836,7 @@ function getDeviceTypes() {
                  "Laptop", "Mini PC", "PC", "Printer", "Server", "Singleboard Computer (SBC)", "NAS",
                  "Domotic", "IP Camera", "Game Console", "SmartTV", "TV Decoder", "Virtual Assistance",
                  "Clock", "House Appliance", "Phone", "Radio",
-                 "AP", "Gateway", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter" )
+                 "AP", "Gateway", "Firewall", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter" )
 
           UNION SELECT 1 as dev_Order, "Smartphone"
           UNION SELECT 1 as dev_Order, "Tablet"
@@ -761,6 +864,7 @@ function getDeviceTypes() {
           -- network devices
           UNION SELECT 5 as dev_Order, "AP"
           UNION SELECT 5 as dev_Order, "Gateway"
+          UNION SELECT 5 as dev_Order, "Firewall"
           UNION SELECT 5 as dev_Order, "Powerline"
           UNION SELECT 5 as dev_Order, "Switch"
           UNION SELECT 5 as dev_Order, "WLAN"
@@ -969,7 +1073,7 @@ function getNmap() {
 function saveNmapPort()
 {
 
-  $portIndex = $_REQUEST['index'];
+  $portIndex = $_REQUEST['id'];
   $value = $_REQUEST['value'];
  
   if(is_integer((int)$portIndex))
@@ -987,9 +1091,83 @@ function saveNmapPort()
       echo 'KO';
     }
   }
-  // echo "asdasdasasd";
+ 
 }
 
+// ----------------------------------------------------------------------------------------
+function updateNetworkLeaf()
+{
+  $nodeMac = $_REQUEST['value'];
+  $leafMac = $_REQUEST['id'];
+
+  if ((false === filter_var($nodeMac , FILTER_VALIDATE_MAC) && $nodeMac != "Internet" && $nodeMac != "") || false === filter_var($leafMac , FILTER_VALIDATE_MAC) ) {
+    throw new Exception('Invalid mac address');
+  }
+  else
+  {
+    global $db;
+    // sql
+    $sql = 'UPDATE Devices SET "dev_Network_Node_MAC_ADDR" = "'. $nodeMac .'" WHERE "dev_MAC"="' . $leafMac.'"' ;
+    // update Data
+    $result = $db->query($sql);
+
+    // check result
+    if ($result == TRUE) {
+      echo 'OK';
+    } else {
+      echo 'KO';
+    }
+  }
+
+}
+
+// ----------------------------------------------------------------------------------------
+function overwriteIconType()
+{
+  $mac = $_REQUEST['mac'];
+  $icon = $_REQUEST['icon'];
+
+  if ((false === filter_var($mac , FILTER_VALIDATE_MAC) && $mac != "Internet" && $mac != "")  ) {
+    throw new Exception('Invalid mac address');
+  }
+  else
+  {
+    global $db;
+    // sql    
+    $sql = 'UPDATE Devices SET "dev_Icon" = "'. $icon .'" where dev_DeviceType in (select dev_DeviceType from Devices where dev_MAC = "' . $mac.'")' ;
+    // update Data
+    $result = $db->query($sql);
+
+    // check result
+    if ($result == TRUE) {
+      echo 'OK';
+    } else {
+      echo lang('BackDevices_Device_UpdDevError');
+    }
+  }
+
+}
+
+//------------------------------------------------------------------------------
+//  Wake-on-LAN 
+// Inspired by @leiweibau: https://github.com/leiweibau/Pi.Alert/commit/30427c7fea180670c71a2b790699e5d9e9e88ffd
+//------------------------------------------------------------------------------
+function wakeonlan() {  
+
+  $WOL_HOST_IP = $_REQUEST['ip'];
+  $WOL_HOST_MAC = $_REQUEST['mac'];
+
+  if (!filter_var($WOL_HOST_IP, FILTER_VALIDATE_IP)) {            
+      echo "Invalid IP! ". lang('BackDevDetail_Tools_WOL_error'); exit;
+  } 
+  elseif (!filter_var($WOL_HOST_MAC, FILTER_VALIDATE_MAC)) {      
+      echo "Invalid MAC! ". lang('BackDevDetail_Tools_WOL_error'); exit;      
+  }
+
+  exec('wakeonlan '.$WOL_HOST_MAC , $output);
+
+  echo lang('BackDevDetail_Tools_WOL_okay');
+}
 
 //------------------------------------------------------------------------------
 //  Status Where conditions

front/php/server/events.php

@@ -9,8 +9,7 @@
 //------------------------------------------------------------------------------
 //------------------------------------------------------------------------------
   // External files
-  require 'db.php';
-  require 'util.php';
+  require dirname(__FILE__).'/init.php';
 
 
 //------------------------------------------------------------------------------

front/php/server/init.php

@@ -0,0 +1,6 @@
+<?php
+require dirname(__FILE__).'/../templates/timezone.php';
+require dirname(__FILE__).'/db.php';
+require dirname(__FILE__).'/util.php';
+require dirname(__FILE__).'/../templates/language/lang.php';
+?>

front/php/server/nmap_scan.php

@@ -33,4 +33,3 @@ if(filter_var($PIA_HOST_IP, FILTER_VALIDATE_IP))  // Vulnerability fix v22.12.20
 {
     echo '<h4>Internal error.</h4>';
 }
-?>

front/php/server/parameters.php

@@ -11,8 +11,7 @@
 
 //------------------------------------------------------------------------------
   // External files
-  require 'db.php';
-  require 'util.php';
+  require dirname(__FILE__).'/init.php';
  
 
 //------------------------------------------------------------------------------
@@ -22,17 +21,28 @@
   ini_set ('max_execution_time','15');
 
   $skipCache = FALSE;
+  $expireMinutes = 5;
+  $defaultValue = '';
+  
 
   if (isset ($_REQUEST['skipcache'])) {
     $skipCache = TRUE;    
   }
 
+  if (isset ($_REQUEST['defaultValue'])) {
+    $defaultValue = $_REQUEST['defaultValue'];    
+  }
+
+  if (isset ($_REQUEST['expireMinutes'])) {
+    $expireMinutes = $_REQUEST['expireMinutes'];    
+  }
+
   // Action functions
   if (isset ($_REQUEST['action']) && !empty ($_REQUEST['action'])) {
     $action = $_REQUEST['action'];
     switch ($action) {
-      case 'get':  getParameter($skipCache);                break;
-      case 'set':  setParameter();                          break;
+      case 'get':  getParameter($skipCache, $defaultValue, $expireMinutes); break;
+      case 'set':  setParameter($expireMinutes);                          break;
       default:     logServerConsole ('Action: '. $action);  break;
     }
   }
@@ -41,18 +51,19 @@
 //------------------------------------------------------------------------------
 //  Get Parameter Value
 //------------------------------------------------------------------------------
-function getParameter($skipCache) {
+function getParameter($skipCache, $defaultValue, $expireMinutes) {
 
   $parameter = $_REQUEST['parameter'];
   $value = "";
 
-  // get the value from the cookie if available
-  if(getCache($parameter) != "")
+  // get the value from the cache if available
+  $cachedValue = getCache($parameter);
+  if($cachedValue != "")
   {
-    $value  = getCache($parameter);
+    $value  = $cachedValue;
   }
 
-  // query the database if no cache entry found or requesting live data for the Back_App_State in the header
+  // query the database if no cache entry found or requesting live data (skipping cache)
   if($skipCache || $value == "" )
   {
     global $db;
@@ -62,13 +73,19 @@ function getParameter($skipCache) {
     
     $result = $db->query($sql);
     $row = $result -> fetchArray (SQLITE3_NUM);  
-    $value = $row[0];
 
-    // Commit DB
-    CommitDB();
+    if($row != NULL && count($row) == 1)
+    {
+      $value = $row[0];
+    } else{
+      $value = $defaultValue;
 
-    // update cookie cache  
-    setCache($parameter, $value);
+      // Nothing found in the DB, Insert new value
+      insertNew($parameter, $value);
+    }
+
+    // update cache  
+    setCache($parameter, $value, $expireMinutes);
   }
   // return value
   echo (json_encode ($value));  
@@ -78,10 +95,10 @@ function getParameter($skipCache) {
 //------------------------------------------------------------------------------
 //  Set Parameter Value
 //------------------------------------------------------------------------------
-function setParameter() {
+function setParameter($expireMinutes) {
 
   $parameter = $_REQUEST['parameter'];
-  $value = $_REQUEST['value'];
+  $value = $_REQUEST['value'];  
     
   global $db;
  
@@ -98,24 +115,30 @@ function setParameter() {
   $changes = $db->changes();
   if ($changes == 0) {
     // Insert new value
-    $sql = 'INSERT INTO Parameters (par_ID, par_Value)
-            VALUES ("'. quotes($parameter) .'",
-                    "'. quotes($value)     .'")';
-    $result = $db->query($sql);
-
-    if (! $result == TRUE) {
-      echo "Error creating parameter\n\n$sql \n\n". $db->lastErrorMsg();
-      return;
-    }
+    insertNew($parameter, $value);
   }
 
-  // Commit DB
-  CommitDB();
-
-  // update cookie cache  
-  setCache($parameter, $value);
+  // update cache  
+  setCache($parameter, $value, $expireMinutes);
 
   echo 'OK';
 }
 
+function insertNew($parameter, $value)
+{
+  global $db;
+
+  // Insert new value
+  $sql = 'INSERT INTO Parameters (par_ID, par_Value)
+          VALUES ("'. quotes($parameter) .'",
+                  "'. quotes($value)     .'")';
+  $result = $db->query($sql);
+
+  if (! $result == TRUE) {
+    echo "Error creating parameter\n\n$sql \n\n". $db->lastErrorMsg();
+    return;
+  }
+}
+
+
 ?>

front/php/server/util.php

@@ -8,8 +8,8 @@
 #  Puche 2021 / 2022+ jokob             jokob@duck.com                GNU GPLv3
 //------------------------------------------------------------------------------
 
-require '/home/pi/pialert/front/php/templates/timezone.php';
-require '/home/pi/pialert/front/php/templates/skinUI.php';
+require dirname(__FILE__).'/../templates/timezone.php';
+require dirname(__FILE__).'/../templates/skinUI.php';
 
 $FUNCTION = [];
 $SETTINGS = [];
@@ -35,7 +35,6 @@ elseif ($FUNCTION  == 'cleanLog')
   cleanLog($SETTINGS);
 }
 
-
 //------------------------------------------------------------------------------
 // Formatting data functions
 //------------------------------------------------------------------------------
@@ -79,6 +78,24 @@ function createArray($input){
   return $options;
 }
 
+// -------------------------------------------------------------------------------------------
+// For debugging - Print arrays
+function printArray ($array) {
+  echo '[';
+  foreach ($array as $val)
+  {
+    if(is_array($val))
+    {
+      echo '<br/>';
+      printArray($val);
+    } else
+    {
+      echo $val.', ';
+    }
+  }  
+  echo ']<br/>';
+}
+
 // -------------------------------------------------------------------------------------------
 function formatDate ($date1) {
   return date_format (new DateTime ($date1) , 'Y-m-d   H:i');
@@ -185,7 +202,7 @@ function cleanLog($logFile)
 
   $path = "";
 
-  $allowedFiles = ['pialert.log', 'pialert_front.log', 'IP_changes.log', 'stdout.log', 'stderr.log', "pialert_pholus.log", "pialert_pholus_lastrun.log"];
+  $allowedFiles = ['pialert.log', 'pialert_front.log', 'IP_changes.log', 'stdout.log', 'stderr.log', "pialert_pholus_lastrun.log"];
   
   if(in_array($logFile, $allowedFiles))
   {
@@ -205,6 +222,8 @@ function cleanLog($logFile)
   } 
 }
 
+
+
 // ----------------------------------------------------------------------------------------
 function saveSettings()
 {
@@ -255,28 +274,35 @@ function saveSettings()
     {
       if($group == $setting[0])
       {            
-        if($setting[3] == 'text' or $setting[3] == 'password' or $setting[3] == 'readonly' or $setting[3] == 'selecttext')
+        if($setting[2] == 'text' or $setting[2] == 'password' or $setting[2] == 'readonly' or $setting[2] == 'selecttext')
         {
-          $txt = $txt.$setting[1]."='".$setting[2]."'\n" ; 
-        } elseif($setting[3] == 'integer' or $setting[3] == 'selectinteger')
+          $val = encode_single_quotes($setting[3]);
+          $txt = $txt.$setting[1]."='".$val."'\n" ; 
+        } elseif($setting[2] == 'integer' or $setting[2] == 'selectinteger')
         {
-          $txt = $txt.$setting[1]."=".$setting[2]."\n" ; 
-        } elseif($setting[3] == 'boolean')
+          $txt = $txt.$setting[1]."=".$setting[3]."\n" ; 
+        } elseif($setting[2] == 'boolean')
         {
           $val = "False";
-          if($setting[2] == 'true')
+          if($setting[3] == 'true')
           {
             $val = "True";
           }
           $txt = $txt.$setting[1]."=".$val."\n" ; 
-        }elseif($setting[3] == 'multiselect' or $setting[3] == 'subnets')
+        }elseif($setting[2] == 'multiselect' or $setting[2] == 'subnets' or $setting[2] == 'list')
         {
-          $temp = '[';
-          foreach($setting[2] as $val)
-          {
-            $temp = $temp."'". $val."',";
+          $temp = '[';         
+          
+          if (count($setting) > 3 && is_array( $setting[3]) == True){
+            foreach($setting[3] as $val)
+            {
+              $temp = $temp."'". encode_single_quotes($val)."',";
+            }
+
+            $temp = substr_replace($temp, "", -1); // remove last comma ','
           }
-          $temp = substr_replace($temp, "", -1).']';  // close brackets and remove last comma ','
+
+          $temp = $temp.']';  // close brackets 
           $txt = $txt.$setting[1]."=".$temp."\n" ; 
         }            
       }
@@ -302,8 +328,6 @@ function saveSettings()
 }
 
 // -------------------------------------------------------------------------------------------
-
-
 function getString ($codeName, $default) {
 
   $result = lang($codeName);
@@ -318,6 +342,16 @@ function getString ($codeName, $default) {
 
 // -------------------------------------------------------------------------------------------
 
+
+function encode_single_quotes ($val) {
+
+  $result = str_replace ('\'','{s-quote}',$val);
+
+  return $result;
+}
+
+// -------------------------------------------------------------------------------------------
+
 function getDateFromPeriod () {
   $period = $_REQUEST['period'];    
   return '"'. date ('Y-m-d', strtotime ('+1 day -'. $period) ) .'"';
@@ -333,13 +367,25 @@ function logServerConsole ($text) {
   $x = array();
   $y = $x['__________'. $text .'__________'];
 }
+    
+// -------------------------------------------------------------------------------------------
+function handleNull ($text, $default = "") {
+  if($text == NULL || $text == 'NULL')
+  {
+    return $default;
+  } else
+  {
+    return $text;
+  }
+  
+}
 
 // -------------------------------------------------------------------------------------------
 
 function getNetworkTypes(){
 
   $array = array(
-    "AP", "Gateway", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter"
+    "AP", "Gateway", "Firewall", "Powerline", "Switch", "WLAN", "PLC", "Router","USB LAN Adapter", "USB WIFI Adapter"
   );
 
   return $array;
@@ -371,7 +417,8 @@ function getDevicesColumns(){
               "dev_Location",
               "dev_Archived",
               "dev_Network_Node_port",
-              "dev_Network_Node_MAC_ADDR"]; 
+              "dev_Network_Node_MAC_ADDR",
+              "dev_Icon"]; 
               
   return $columns;
 }
@@ -389,11 +436,9 @@ function getCache($key) {
   }
 }
 // -------------------------------------------------------------------------------------------
-function setCache($key, $value) {
-  setcookie($key,  $value, time()+300, "/","", 0); // 5min cache
+function setCache($key, $value, $expireMinutes = 5) {
+  setcookie($key,  $value, time()+$expireMinutes*60, "/","", 0); 
 }
 
 
-?>
-
-
+?>

front/php/templates/footer.php

@@ -12,9 +12,14 @@
     <!-- Default to the left -->
 
     <!-- &copy; 2020 Puche -->
-    <?php
-      echo '<span style="display:inline-block; transform: rotate(180deg)">&copy;</span> 2020 Puche (2022+ <a href="mailto:jokob@duck.com?subject=PiAlert">jokob-sk</a>)';
-    ?>
+    <span style="display:inline-block; transform: rotate(180deg)">&copy;</span>
+    
+       2020 Puche (2022+ <a href="mailto:jokob@duck.com?subject=PiAlert">jokob-sk</a>)  
+
+      <a href="https://github.com/jokob-sk/Pi.Alert/tree/main/docs" target="_blank"> 
+        <span>Docs <i class="fa fa-circle-question"></i>
+      </a><span>
+    
     <!-- To the right -->
     <div class="pull-right no-hidden-xs">
 

front/php/templates/graph.php

@@ -1,7 +1,5 @@
 <?php
 
-require 'php/server/db.php';
-
 global $db;
 
 $Pia_Graph_Device_Time = array();
@@ -27,6 +25,3 @@ function pia_graph_devices_data($Pia_Graph_Array) {
       echo ",";
   }
 }
-
-
-?>

front/php/templates/header.php

@@ -8,11 +8,8 @@
 #--------------------------------------------------------------------------- -->
 
 <?php
-
-require '/home/pi/pialert/front/php/templates/timezone.php';
-require '/home/pi/pialert/front/php/templates/skinUI.php';
-require '/home/pi/pialert/front/php/templates/language/lang.php';
-require '/home/pi/pialert/front/php/templates/security.php';
+require dirname(__FILE__).'/../server/init.php';
+require dirname(__FILE__).'/security.php';
 
 ?>
 
@@ -115,7 +112,7 @@ if ($ENABLED_DARKMODE === True) {
 
 <!-- ----------------------------------------------------------------------- -->
 <!-- Layout Boxed Yellow -->
-<body class="hold-transition <?php echo $pia_skin_selected;?> layout-boxed sidebar-mini" <?php echo $BACKGROUND_IMAGE_PATCH;?> onLoad="show_pia_servertime();" >
+<body class="hold-transition <?php echo $pia_skin_selected;?> sidebar-mini" <?php echo $BACKGROUND_IMAGE_PATCH;?> onLoad="show_pia_servertime();" >
 <!-- Site wrapper -->
 <div class="wrapper">
 
@@ -170,8 +167,8 @@ if ($ENABLED_DARKMODE === True) {
               <li class="user-header" style=" height: 100px;">
                 <img src="img/pialertLogoWhite.png" class="img-circle" alt="Pi.Alert Logo" style="border-color:transparent;  height: 50px; width: 50px; margin-top:15px;">
                 <p style="float: right; width: 200px">
-                <?php echo lang('About_Title');?>
-                  <small><?php echo lang('About_Design');?> Raspberry Pi</small>
+                <?= lang('About_Title');?>
+                  <small><?= lang('About_Design');?> Raspberry Pi</small>
                 </p>
               </li>
 
@@ -179,7 +176,7 @@ if ($ENABLED_DARKMODE === True) {
 
               <li class="user-footer">
                 <div class="pull-right">
-                  <a href="index.php?action=logout" class="btn btn-danger"><?php echo lang('About_Exit');?></a>
+                  <a href="index.php?action=logout" class="btn btn-danger"><?= lang('About_Exit');?></a>
                 </div>
               </li>
             </ul>
@@ -210,31 +207,35 @@ if ($ENABLED_DARKMODE === True) {
       <ul class="sidebar-menu" data-widget="tree">
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('devices.php', 'deviceDetails.php') ) ){ echo 'active'; } ?>">
-          <a href="devices.php"><i class="fa fa-laptop"></i> <span><?php echo lang('Navigation_Devices');?></span></a>
+          <a href="devices.php"><span><i class="fa fa-laptop"></i> <?= lang('Navigation_Devices');?></span></a>
         </li>
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('presence.php') ) ){ echo 'active'; } ?>">
-          <a href="presence.php"><i class="fa fa-calendar"></i> <span><?php echo lang('Navigation_Presence');?></span></a>
+          <a href="presence.php"><i class="fa fa-calendar"></i> <?= lang('Navigation_Presence');?></span></a>
         </li>
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('events.php') ) ){ echo 'active'; } ?>">
-          <a href="events.php"><i class="fa fa-bolt"></i> <span><?php echo lang('Navigation_Events');?></span></a>
+          <a href="events.php"><i class="fa fa-bolt"></i> <span><?= lang('Navigation_Events');?></span></a>
         </li>
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('network.php') ) ){ echo 'active'; } ?>">
-          <a href="network.php"><i class="fa fa-server"></i> <span><?php echo lang('Navigation_Network');?></span></a>
+          <a href="network.php"><span><i class="fa fa-fw fa-network-wired"></i>  <?= lang('Navigation_Network');?></span></a>
+        </li>
+
+        <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('plugins.php') ) ){ echo 'active'; } ?>">
+          <a href="plugins.php"><span><i class="fa fa-fw fa-plug"></i>  <?= lang('Navigation_Plugins');?></span></a>
         </li>
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('maintenance.php') ) ){ echo 'active'; } ?>">
           <div class="new-version myhidden" id="version" data-build-time="<?php echo file_get_contents( "buildtimestamp.txt");?>">🆕</div>
-          <a href="maintenance.php"><i class="fa fa-wrench "></i> <span><?php echo lang('Navigation_Maintenance');?></span></a>
+          <a href="maintenance.php"><i class="fa fa-wrench "></i> <span><?= lang('Navigation_Maintenance');?></span></a>
         </li>
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('settings.php') ) ){ echo 'active'; } ?>">
-          <a href="settings.php"><i class="fa fa-cog"></i> <span><?php echo lang('Navigation_Settings');?></span></a>
+          <a href="settings.php"><i class="fa fa-cog"></i> <span><?= lang('Navigation_Settings');?></span></a>
         </li>
 
         <li class=" <?php if (in_array (basename($_SERVER['SCRIPT_NAME']), array('help_faq.php') ) ){ echo 'active'; } ?>">
-          <a href="help_faq.php"><i class="fa fa-question"></i> <span><?php echo lang('Navigation_HelpFAQ');?></span></a>
+          <a href="help_faq.php"><i class="fa fa-question"></i> <span><?= lang('Navigation_HelpFAQ');?></span></a>
         </li>
       </ul>
 
@@ -260,7 +261,7 @@ if ($ENABLED_DARKMODE === True) {
     }
 
     // get parameter value
-    $.get('php/server/parameters.php?action=get&parameter='+ key + skipCacheQuery, function(data) {
+    $.get('php/server/parameters.php?action=get&defaultValue=NULL&parameter='+ key + skipCacheQuery, function(data) {
       var result = data;
 
       document.getElementById(targetId).innerHTML = result.replaceAll('"', '');    

front/php/templates/language/de_de.php

@@ -380,7 +380,7 @@ $lang['de_de'] = array(
          									lösche ggf. die betreffende DHCP-Lease. Anschließend schaue, ebenfalls in Pi-hole, unter Tools -> Network, ob sich dort die immer wiederkehrenden Hosts finden lassen. 
          									Wenn ja, lösche diese dort ebenfalls. Nun kannst du Pi.Alert wieder starten. Jetzt sollte das Gerät/die Geräte nicht mehr auftauchen.',
 'HelpFAQ_Cat_Detail_300_head' => 'Was bedeutet ',
-'HelpFAQ_Cat_Detail_300_text_a' => 'meint ein Netzwerkgerät (welches den typ AP, Gateway, Powerline, Switch, WLAN, PLC, Router,USB LAN Adapter, USB WIFI Adapter, or Internet eingestellt hat)',
+'HelpFAQ_Cat_Detail_300_text_a' => 'meint ein Netzwerkgerät (welches den typ AP, Gateway, Firewall, Powerline, Switch, WLAN, PLC, Router,USB LAN Adapter, USB WIFI Adapter, or Internet eingestellt hat)',
 'HelpFAQ_Cat_Detail_300_text_b' => 'bezeichnet die Anschlussnummer/Portnummer, an der das gerade bearbeitete Gerät mit diesem Netzwerkgerät verbunden ist.',
 'HelpFAQ_Cat_Detail_301_head_a' => 'Wann wird nun gescannt? Bei ',
 'HelpFAQ_Cat_Detail_301_head_b' => ' steht 1min aber der Graph zeigt 5min - Abstände an.',

front/php/templates/language/en_us.php

@@ -13,8 +13,13 @@ $lang['en_us'] = array(
 // General
 //////////////////////////////////////////////////////////////////
 'Gen_Delete' => 'Delete',
+'Gen_DeleteAll' => 'Delete all',
 'Gen_Cancel' => 'Cancel',
 'Gen_Okay' => 'Ok',
+'Gen_Save' => 'Save',
+'Gen_Saved' => 'Saved',
+'Gen_Run' => 'Run',
+'Gen_Action' => 'Action',
 'Gen_Purge' => 'Purge',
 'Gen_Backup' => 'Run Backup',
 'Gen_Restore' => 'Run Restore',
@@ -22,6 +27,9 @@ $lang['en_us'] = array(
 'Gen_AreYouSure' => 'Are you sure?',
 'Gen_Upd' => 'Updated successfully',
 'Gen_Upd_Fail' => 'Update failed',
+'Gen_Help' => 'Need help?',
+'Gen_DataUpdatedUITakesTime' => 'OK - It may take a while for the UI to update if a scan is runnig.',
+'Gen_LockedDB' => 'ERROR - DB might be locked - Check F12 Dev tools -> Console or try later.',
 
 //////////////////////////////////////////////////////////////////
 // Login Page - Update by @TeroRERO 03ago2022
@@ -48,9 +56,10 @@ $lang['en_us'] = array(
 'Navigation_Devices' => 'Devices',
 'Navigation_Presence' => 'Presence',
 'Navigation_Events' => 'Events',
+'Navigation_Network' => 'Network',
+'Navigation_Plugins' => 'Plugins',
 'Navigation_Maintenance' => 'Maintenance',
 'Navigation_Settings' => 'Settings',
-'Navigation_Network' => 'Network',
 'Navigation_HelpFAQ' => 'Help / FAQ',
 'Device_Title' => 'Devices',
 'Device_Shortcut_AllDevices' => 'All Devices',
@@ -64,14 +73,21 @@ $lang['en_us'] = array(
 'Device_TableHead_Name' => 'Name',
 'Device_TableHead_Owner' => 'Owner',
 'Device_TableHead_Type' => 'Type',
+'Device_TableHead_Icon' => 'Icon',
+'Device_TableHead_RowID' => 'Row ID',
+'Device_TableHead_Rowid' => 'Row ID',
+'Device_TableHead_Parent_MAC' => 'Parent node MAC',
+'Device_TableHead_Connected_Devices' => 'Connected Devices',
+'Device_TableHead_Location' => 'Location',
+'Device_TableHead_Vendor' => 'Vendor',
 'Device_TableHead_Favorite' => 'Favorite',
 'Device_TableHead_Group' => 'Group',
 'Device_TableHead_FirstSession' => 'First Session',
 'Device_TableHead_LastSession' => 'Last Session',
 'Device_TableHead_LastIP' => 'Last IP',
 'Device_TableHead_MAC' => 'MAC',
+'Device_TableHead_MAC_full' => 'Full MAC',
 'Device_TableHead_LastIPOrder' => 'Last IP Order',
-'Device_TableHead_Rowid' => 'Rowid',
 'Device_TableHead_Status' => 'Status',
 'Device_Searchbox' => 'Search',
 'Device_Tablelenght' => 'Show _MENU_ entries',
@@ -150,40 +166,43 @@ $lang['en_us'] = array(
 'DevDetail_Shortcut_Sessions' => 'Sessions',
 'DevDetail_Shortcut_Presence' => 'Presence',
 'DevDetail_Shortcut_DownAlerts' => 'Down Alerts',
-'DevDetail_Tab_Details' => 'Details',
-'DevDetail_Tab_Nmap' => 'Nmap',
-'DevDetail_Tab_Sessions' => 'Sessions',
-'DevDetail_Tab_Presence' => 'Presence',
-'DevDetail_Tab_Events' => 'Events',
-'DevDetail_Tab_Pholus' => 'Pholus',
+'DevDetail_Tab_Details' => '<i class="fa fa-info-circle"></i> Details',
+'DevDetail_Tab_Nmap' => '<i class="fa fa-ethernet"></i> Nmap',
+'DevDetail_Tab_Sessions' => '<i class="fa fa-list-ol"></i> Sessions',
+'DevDetail_Tab_Presence' => '<i class="fa fa-calendar"></i> Presence',
+'DevDetail_Tab_Events' => '<i class="fa fa-bolt"></i> Events',
+'DevDetail_Tab_Pholus' => '<i class="fa fa-search"></i> Pholus',
 'DevDetail_Tab_PholusEmpty' => 'Nothing sniffed out with Pholus for this device.',
 'DevDetail_Tab_NmapTableHeader' => 'Scheduled scan results',
 'DevDetail_Tab_NmapTableText' => 'Set up a schedule in <a href="/settings.php#NMAP_ACTIVE">Settings</a>',
 'DevDetail_Tab_NmapEmpty' => 'No ports detected with Nmap on this device.',
-'DevDetail_MainInfo_Title' => 'Main Info',
+'DevDetail_MainInfo_Title' => '<i class="fa fa-pencil"></i> Main Info',
 'DevDetail_MainInfo_mac' => 'MAC',
 'DevDetail_MainInfo_Name' => 'Name',
 'DevDetail_MainInfo_Owner' => 'Owner',
 'DevDetail_MainInfo_Type' => 'Type',
+'DevDetail_Icon' => 'Icon',
+'DevDetail_Icon_Descr' => 'Enter a font awesome icon name without the fa- prefix or with complete class, e.g.: fa fa-brands fa-apple.',
 'DevDetail_MainInfo_Vendor' => 'Vendor',
 'DevDetail_MainInfo_Favorite' => 'Favorite',
 'DevDetail_MainInfo_Group' => 'Group',
 'DevDetail_MainInfo_Location' => 'Location',
 'DevDetail_MainInfo_Comments' => 'Comments',
-'DevDetail_MainInfo_Network_Title' => 'Network',
-'DevDetail_MainInfo_Network' => 'Network Node (MAC)',
-'DevDetail_MainInfo_Network_Port' => 'Connected to Port',
-'DevDetail_SessionInfo_Title' => 'Session Info',
+'DevDetail_MainInfo_Network_Title' => '<i class="fa fa-network-wired"></i> Network',
+'DevDetail_MainInfo_Network' => '<i class="fa fa-server"></i> Node (MAC)',
+'DevDetail_GoToNetworkNode' => 'Navigate to the Network page of the given node.',
+'DevDetail_MainInfo_Network_Port' => '<i class="fa fa-ethernet"></i> Port',
+'DevDetail_SessionInfo_Title' => '<i class="fa fa-calendar"></i> Session Info',
 'DevDetail_SessionInfo_Status' => 'Status',
 'DevDetail_SessionInfo_FirstSession' => 'First Session',
 'DevDetail_SessionInfo_LastSession' => 'Last Session',
 'DevDetail_SessionInfo_LastIP' => 'Last IP',
 'DevDetail_SessionInfo_StaticIP' => 'Static IP',
-'DevDetail_EveandAl_Title' => 'Events & Alerts config',
+'DevDetail_EveandAl_Title' => '<i class="fa fa-bolt"></i> Events & Alerts config',
 'DevDetail_EveandAl_ScanCycle' => 'Scan device',
 'DevDetail_EveandAl_AlertAllEvents' => 'Alert All Events',
 'DevDetail_EveandAl_AlertDown' => 'Alert Down',
-'DevDetail_EveandAl_Skip' => 'Skip repeated notifications during',
+'DevDetail_EveandAl_Skip' => 'Skip repeated notifications for',
 'DevDetail_EveandAl_NewDevice' => 'New Device',
 'DevDetail_EveandAl_Archived' => 'Archived',
 'DevDetail_EveandAl_RandomMAC' => 'Random MAC',
@@ -194,8 +213,9 @@ $lang['en_us'] = array(
 'DevDetail_button_DeleteEvents_Warning' => 'Are you sure you want to delete all Events of this device?<br><br>(this will clear the <b>Events history</b> and the <b>Sessions</b> and might help with constant (persistent) notifications)',
 'DevDetail_button_Reset' => 'Reset Changes',
 'DevDetail_button_Save' => 'Save',
-'DevDetail_button_DeleteEvents' => 'Delete Events',
-'DevDetail_button_DeleteEvents_Warning' => 'Are you sure you want to delete all Events of this device?<br><br>(this will clear the <b>Events history</b> and the <b>Sessions</b> and might help with constant (persistent) notifications)',
+'DevDetail_button_OverwriteIcons' => 'Overwrite Icons',
+'DevDetail_button_OverwriteIcons_Tooltip' => 'Overwrite icons of all devices with the same device type',
+'DevDetail_button_OverwriteIcons_Warning' => 'Are you sure you want to overwrite all icons of all devices with the same device type as the current device type?',
 'DevDetail_SessionTable_Order' => 'Order',
 'DevDetail_SessionTable_Connection' => 'Connection',
 'DevDetail_SessionTable_Disconnection' => 'Disconnection',
@@ -212,6 +232,17 @@ $lang['en_us'] = array(
 'DevDetail_Nmap_buttonSkipDiscovery' => 'Skip host discovery',
 'DevDetail_Nmap_buttonSkipDiscovery_text' => 'Skip host discovery (-Pn option): Default scan without host discovery',
 'DevDetail_Nmap_resultsLink' => 'You can leave this page after starting a scan. Results will be also available in the <code>pialert_front.log</code> file.',
+'BackDevDetail_Actions_Title_Run' => 'Run action',
+'BackDevDetail_Actions_Not_Registered' => 'Action not registered: ',
+'BackDevDetail_Actions_Ask_Run' => 'Do you want to execute the action?',
+'BackDevDetail_Tools_WOL_okay' => 'The command was executed.',
+'BackDevDetail_Tools_WOL_error' => 'The command was NOT executed.',
+'DevDetail_Tools_WOL_noti' => 'Wake-on-LAN',
+'DevDetail_Tools_WOL_noti_text' => 'The Wake-on-LAN command is sent to the broadcast address. If the target is not in the subnet/vlan of Pi.Alert, the target device will not respond.',
+'DevDetail_Tools_WOL' => 'Send Wol command to ',
+'DevDetail_WOL_Title' => '<i class="fa fa-power-off"></i> Wake-on-LAN',
+'DevDetail_Run_Actions_Title' => '<i class="fa fa-play"></i> Run action on device',
+'DevDetail_Run_Actions_Tooltip' => 'Run an action on the current device from the dropdown list.',
 
 //////////////////////////////////////////////////////////////////
 // Maintenance Page
@@ -246,7 +277,11 @@ $lang['en_us'] = array(
 'Maintenance_Tools_Tab_Tools' => 'Tools',
 'Maintenance_Tools_Tab_BackupRestore' => 'Backup / Restore',
 'Maintenance_Tools_Tab_Logging' => 'Logs',
+'Maintenance_Tool_displayed_columns_text' => 'Change the visibility and order of the columns in the <a href="devices.php"><b> <i class="fa fa-laptop"></i> Devices</b></a> page. (The drag-and-drop is a bit clunky, but for now workable, not a common task - won\'t fix for now (tried for <a href="https://github.com/jokob-sk/Pi.Alert/commit/94b32f0f7332879f5a7d2af05dafa2e5d5cfa5da">like 3h</a> - happy for someone to submit a PR :) )).',
+'Maintenance_Tool_order_columns_text' => '',
 'Maintenance_Tool_darkmode' => 'Toggle Modes (Dark/Light)',
+'Maintenance_Tool_drag_me' => 'Drag me to reorder columns.',
+'Maintenance_Tool_check_visible' => 'Uncheck to hide column.',
 'Maintenance_Tool_darkmode_text' => 'Toggle between dark mode and light mode. If the switch does not work properly, try to clear the browser cache. The change takes place on the server side, so it affects all devices in use.',
 'Maintenance_Tool_darkmode_noti' => 'Toggle Modes',
 'Maintenance_Tool_darkmode_noti_text' => 'After the theme switch, the page tries to reload itself to activate the change. If necessary, the cache must be cleared.',
@@ -330,6 +365,7 @@ $lang['en_us'] = array(
 'BackDevices_DBTools_ImportCSV' => 'The devices from the CSV file were imported successfully.',
 'BackDevices_DBTools_ImportCSVError' => 'The CSV file couldn\'t be imported. Make sure the format is correct.',
 'BackDevices_DBTools_ImportCSVMissing' => 'The CSV file couldn\'t be found under <b>/config/devices.csv.</b>',
+'BackDevices_Device_UpdDevError' => 'Error updating devices, try later. The database is probable locked due to an ongoing task.',
 
 
 //////////////////////////////////////////////////////////////////
@@ -339,6 +375,8 @@ $lang['en_us'] = array(
 'Network_Title' => 'Network overview',
 'Network_ManageDevices' => 'Manage Devices',
 'Network_ManageAdd' => 'Add Device',
+'Network_ManageAssign' => 'Assign',
+'Network_ManageUnassign' => 'Unassign',
 'Network_ManageEdit' => 'Update Device',
 'Network_ManageDel' => 'Delete Device',
 'Network_ManageAdd_Name' => 'Device Name',
@@ -364,6 +402,13 @@ $lang['en_us'] = array(
 'Network_Table_Hostname' => 'Hostname',
 'Network_Table_IP' => 'IP',
 'Network_UnassignedDevices' => 'Unassigned devices',
+'Network_Assign' => 'Connect to the above <i class="fa fa-server"></i> Network node',
+'Network_Connected' => 'Connected devices',
+'Network_ManageLeaf' => 'Manage assignment',
+'Network_Node' => 'Network node',
+'Network_Node_Name' => 'Node name',
+'Network_Parent' => 'Parent network device',
+'Network_NoAssignedDevices' => 'This network node doesn\'t have any assigned devices (leaf nodes). Assign one from bellow or go to the <b><i class="fa fa-info-circle"></i> Details</b> tab of any device in <a href="devices.php"><b> <i class="fa fa-laptop"></i> Devices</b></a>, and assign it to a network <b><i class="fa fa-server"></i> Node (MAC)</b> and <b><i class="fa fa-ethernet"></i> Port</b> there.',
 
 //////////////////////////////////////////////////////////////////
 // Help Page
@@ -371,7 +416,7 @@ $lang['en_us'] = array(
 
 'HelpFAQ_Title' => 'Help / FAQ',
 'HelpFAQ_Cat_General' => 'General',
-'HelpFAQ_Cat_Detail' => 'Details',
+'HelpFAQ_Cat_Detail' => '<i class="fa fa-info-circle"></i> Details',
 'HelpFAQ_Cat_General_100_head' => 'The clock on the top right and the times of the events/presence are not correct (time difference).',
 'HelpFAQ_Cat_General_100_text_a' => 'On your PC the following time zone is set for the PHP environment:',
 'HelpFAQ_Cat_General_100_text_b' => 'If this is not the timezone you are in, you should change the timezone in the PHP configuration file. You can find it in this directory:',
@@ -389,7 +434,7 @@ $lang['en_us'] = array(
                 							 chmod -R 770 ~/pialert/db
               								 </span><br>
               								 If the database is still read-only, try reinstalling or restoring a database backup from the maintenance page.',
-'HelpFAQ_Cat_General_102docker_head' => '(🐳 Docker only) Database issues (AJAX errors, read-only, not found)',
+'HelpFAQ_Cat_General_102docker_head' => 'Database issues (AJAX errors, read-only, not found)',
 'HelpFAQ_Cat_General_102docker_text' => 'Double-check you\'ve followed the <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/tree/main/dockerfiles">dockerfile readme (most up-to-date info)</a>. <br/> <br/> <ul data-sourcepos="49:4-52:146" dir="auto">
 											<li data-sourcepos="49:4-49:106">Download the <a target="_blank"  href="https://github.com/jokob-sk/Pi.Alert/blob/main/db/pialert.db">original DB from GitHub</a>.</li>
 											<li data-sourcepos="50:4-50:195">Map the <code>pialert.db</code> file (<g-emoji class="g-emoji" alias="warning" fallback-src="https://github.githubassets.com/images/icons/emoji/unicode/26a0.png">⚠</g-emoji> not folder) from above to <code>/home/pi/pialert/db/pialert.db</code> (see <a target="_blank"  href="https://github.com/jokob-sk/Pi.Alert/tree/main/dockerfiles#-examples">Examples</a> for details).</li>
@@ -405,8 +450,8 @@ $lang['en_us'] = array(
          									delete the DHCP lease if necessary. Then, also in Pi-hole, look under Tools -> Network to see if you can find the recurring hosts there. 
          									If yes, delete them there as well. Now you can start Pi.Alert again. Now the device(s) should not show up anymore.',
 'HelpFAQ_Cat_Detail_300_head' => 'What means ',
-'HelpFAQ_Cat_Detail_300_text_a' => 'means a network device (a device of the type AP, Gateway, Powerline, Switch, WLAN, PLC, Router,USB LAN Adapter, USB WIFI Adapter, or Internet).',
-'HelpFAQ_Cat_Detail_300_text_b' => 'designates the port number where the currently edited device is connected to this network device.',
+'HelpFAQ_Cat_Detail_300_text_a' => 'means a network device (a device of the type AP, Gateway, Firewall, Powerline, Switch, WLAN, PLC, Router,USB LAN Adapter, USB WIFI Adapter, or Internet).',
+'HelpFAQ_Cat_Detail_300_text_b' => 'designates the port number where the currently edited device is connected to this network device. Read <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/NETWORK_TREE.md">this guide</a> for more info.',
 'HelpFAQ_Cat_Detail_301_head_a' => 'When is scanning now? At ',
 'HelpFAQ_Cat_Detail_301_head_b' => ' says 1min but the graph shows 5min intervals.',
 'HelpFAQ_Cat_Detail_301_text' => 'The time interval between the scans is defined by the "Cronjob", which is set to 5min by default. The designation "1min" refers to the expected duration of the scan. 
@@ -428,7 +473,7 @@ $lang['en_us'] = array(
 											  and then simply switch the device off again. Now Pi.Alert should properly note the state of the device in the database with the next scan.',
 'HelpFAQ_Cat_Network_600_head' => 'What is this page for?',
 'HelpFAQ_Cat_Network_600_text' => 'This page should offer you the possibility to map the assignment of your network devices. For this purpose, you can create one or more switches, WLANs, routers, etc., provide them with a port number if necessary and assign already detected 
-											 devices to them. This assignment is done in the detailed view of the device to be assigned. So it is possible for you to quickly determine to which port a host is connected and if it is online.',
+											 devices to them. This assignment is done in the detailed view of the device to be assigned. So it is possible for you to quickly determine to which port a host is connected and if it is online. Read <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/NETWORK_TREE.md">this guide</a> for more info.',
 
 //////////////////////////////////////////////////////////////////
 // Front end events
@@ -436,11 +481,21 @@ $lang['en_us'] = array(
 
 'test_event_tooltip' => 'Save your changes at first before you test your settings.',
 'test_event_icon' => 'fa-vial-circle-check',
+'run_event_tooltip' => 'Enable the setting and save your changes at first before you run it.',
+'run_event_icon' => 'fa-play',
 'general_event_title' => 'Executing an ad-hoc event',
 'general_event_description' => 'The event you\'ve triggered might take a while until background processes finish. The execution ended once you see <code>finished</code> below. Check the <a onclick=\'setCache(\"activeMaintenanceTab\", \"tab_Logging_id\")\' href=\"/maintenance.php#tab_Logging\">error log</a> if you didn\'t get the expected result. <br/> <br/>  Status: ',
 
 
 
+//////////////////////////////////////////////////////////////////
+// Plugins
+//////////////////////////////////////////////////////////////////
+
+'Plugins_Unprocessed_Events' => 'Unprocessed Events',
+'Plugins_Objects' => 'Plugin Objects',
+'Plugins_History' => 'Events History',
+
 //////////////////////////////////////////////////////////////////
 // Settings
 //////////////////////////////////////////////////////////////////
@@ -454,25 +509,20 @@ $lang['en_us'] = array(
 
 
 //General
+'General_display_name' => 'General',
+'General_icon' => '<i class="fa fa-gears"></i>',
 'ENABLE_ARPSCAN_name' => 'Enable ARP scan',
 'ENABLE_ARPSCAN_description' => 'Arp-scan is a command-line tool that uses the ARP protocol to discover and fingerprint IP hosts on the local network. An alternative to ARP scan is to enable the <a onclick="toggleAllSettings()" href="#PIHOLE_ACTIVE"><code>PIHOLE_ACTIVE</code>PiHole integration settings</a>.',
 'SCAN_SUBNETS_name' => 'Subnets to scan',
 'SCAN_SUBNETS_description' => '
-
-The arp-scan time itself depends on the number of IP addresses to check. 
-The number of IPs to check depends on the <a target="_blank" href="https://www.calculator.net/ip-subnet-calculator.html">network mask</a> you set here. 
-For example, a <code>/24</code> mask results in 256 IPs to check, where as a <code>/16</code> 
-mask checks around 65,536. Every IP takes a couple seconds. This means that with an incorrect configuration 
-the arp-scan will take hours to complete instead of seconds.
-<ol>
-<li>Specify the network mask. For example, the filter <code>192.168.1.0/24</code> covers IP ranges 192.168.1.0 to 192.168.1.255.</li>
-<li>Run <code>iwconfig</code> in your container to find your interface name(s) (e.g.: <code>eth0</code>, <code>eth1</code>)</li>
-</ol>
+The arp-scan time itself depends on the number of IP addresses to check so set this up carefully with the appropriate network mask and interface. Check the <a href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/SUBNETS.md" target="_blank">subnets documentation</a> for help on setting up VLANs, what VLANs are supported, or how to figure out the network mask and your interface.
 ',
-'PRINT_LOG_name' => 'Print additional logging',
-'PRINT_LOG_description' => 'This setting will enable more verbose logging. Useful for debugging events writing into the database.',
+'LOG_LEVEL_name' => 'Print additional logging',
+'LOG_LEVEL_description' => 'This setting will enable more verbose logging. Useful for debugging events writing into the database.',
 'TIMEZONE_name' => 'Time zone',
 'TIMEZONE_description' => 'Time zone to display stats correctly. Find your time zone <a target="_blank" href="https://en.wikipedia.org/wiki/List_of_tz_database_time_zones" rel="nofollow">here</a>.',
+'ENABLE_PLUGINS_name' => 'Enable Plugins',
+'ENABLE_PLUGINS_description' => 'Enables the <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins">plugins</a> functionality. Loading plugins requires more hardware resources so you might want to disable them on low-powered system.',
 'PIALERT_WEB_PROTECTION_name' => 'Enable login',
 'PIALERT_WEB_PROTECTION_description' => 'When enabled a login dialog is displayed. Read below carefully if you get locked out of your instance.',
 'PIALERT_WEB_PASSWORD_name' => 'Login password',
@@ -480,21 +530,25 @@ the arp-scan will take hours to complete instead of seconds.
 'INCLUDED_SECTIONS_name' => 'Notify on',
 'INCLUDED_SECTIONS_description' => 'Specifies which events trigger notifications. Remove the event type(s) you don\'t want to get notified on. This setting overrides device-specific settings in the UI. (<code>CTRL + Click</code> to select / deselect).',
 'SCAN_CYCLE_MINUTES_name' => 'Scan cycle delay',
-'SCAN_CYCLE_MINUTES_description' => 'The delay between scans. If using arp-scan, the scan time itself depends on the number of IP addresses to check. This is influenced by the network mask set in the <a href="#SCAN_SUBNETS"><code>SCAN_SUBNETS</code> setting</a> at the top. Every IP takes a couple seconds to scan.',
+'SCAN_CYCLE_MINUTES_description' => 'The delay between scans in minutes. If using arp-scan, the scan time itself depends on the number of IP addresses to check. This is influenced by the network mask set in the <a href="#SCAN_SUBNETS"><code>SCAN_SUBNETS</code> setting</a> at the top. Every IP takes a couple seconds to scan.',
 'DAYS_TO_KEEP_EVENTS_name' => 'Delete events older than',
-'DAYS_TO_KEEP_EVENTS_description' => 'This is a maintenance setting. This specifies the number of days worth of event entries that will be kept. All older events will be deleted periodically.',
+'DAYS_TO_KEEP_EVENTS_description' => 'This is a maintenance setting. This specifies the number of days worth of event entries that will be kept. All older events will be deleted periodically. Also applies on Plugin Events History.',
 'REPORT_DASHBOARD_URL_name' => 'Pi.Alert URL',
 'REPORT_DASHBOARD_URL_description' => 'This URL is used as the base for generating links in the emails. Enter full URL starting with <code>http://</code> including the port number (no trailig slash <code>/</code>).',
 'DIG_GET_IP_ARG_name' => 'Internet IP discovery',
 'DIG_GET_IP_ARG_description' => 'Change the <a href="https://linux.die.net/man/1/dig" target="_blank">dig utility</a> arguments if you have issues resolving your Internet IP. Arguments are added at the end of the following command: <code>dig +short </code>.',
+'UI_LANG_name' => 'UI Language',
+'UI_LANG_description' => 'Select the preferred UI language.',
 
 //Email
+'Email_display_name' => 'Email',
+'Email_icon' => '<i class="fa fa-at"></i>',
 'REPORT_MAIL_name' => 'Enable email',
 'REPORT_MAIL_description' => 'If enabled an email is sent out with a list of changes you\'ve subscribed to. Please also fill out all remaining settings related to the SMTP setup below.',
 'SMTP_SERVER_name' => 'SMTP server URL',
-'SMTP_SERVER_description' => 'The SMTP server host URL. For example <code>smtp-relay.sendinblue.com</code>.',
+'SMTP_SERVER_description' => 'The SMTP server host URL. For example <code>smtp-relay.sendinblue.com</code>. To use Gmail as an SMTP server <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/SMTP_GMAIL.md">follow this guide</a>',
 'SMTP_PORT_name' => 'SMTP server PORT',
-'SMTP_PORT_description' => 'Port number used for the SMTP connection.',
+'SMTP_PORT_description' => 'Port number used for the SMTP connection. Set to <code>0</code> if you don\'t want to use a port when connecting to the SMTP server.',
 'SMTP_SKIP_LOGIN_name' => 'Skip authentication',
 'SMTP_SKIP_LOGIN_description' => 'Don\'t use authentication when connecting to the  SMTP server.',
 'SMTP_USER_name' => 'SMTP user',
@@ -503,12 +557,16 @@ the arp-scan will take hours to complete instead of seconds.
 'SMTP_PASS_description' => 'The SMTP server password. ',
 'SMTP_SKIP_TLS_name' => 'Don\'t use TLS',
 'SMTP_SKIP_TLS_description' => 'Disable TLS when connecting to your SMTP server.',
+'SMTP_FORCE_SSL_name' => 'Force SSL',
+'SMTP_FORCE_SSL_description' => 'Force SSL when connecting to your SMTP server.',
 'REPORT_TO_name' => 'Send email to',
 'REPORT_TO_description' => 'Email address to which the notification will be send to.',
 'REPORT_FROM_name' => 'Email subject',
 'REPORT_FROM_description' => 'Notification email subject line.',
 
 //Webhooks
+'Webhooks_display_name' => 'Webhooks',
+'Webhooks_icon' => '<i class="fa fa-circle-nodes"></i>',
 'REPORT_WEBHOOK_name' => 'Enable Webhooks',
 'REPORT_WEBHOOK_description' => 'Enable webhooks for notifications. Webhooks help you to connect to a lot of 3rd party tools, such as IFTTT, Zapier or <a href="https://n8n.io/" target="_blank">n8n</a> to name a few. Check out this simple <a href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/WEBHOOK_N8N.md" target="_blank">n8n guide here</a> to get started. If enabled, configure related settings below.',
 'WEBHOOK_URL_name' => 'Target URL',
@@ -519,14 +577,18 @@ the arp-scan will take hours to complete instead of seconds.
 'WEBHOOK_REQUEST_METHOD_description' => 'The HTTP request method to be used for the webhook call.',
 
 // Apprise
+'Apprise_display_name' => 'Apprise',
+'Apprise_icon' => '<i class="fa fa-bullhorn"></i>',
 'REPORT_APPRISE_name' => 'Enable Apprise',
 'REPORT_APPRISE_description' => 'Enable sending notifications via <a target="_blank" href="https://hub.docker.com/r/caronc/apprise">Apprise</a>.',
 'APPRISE_HOST_name' => 'Apprise host URL',
 'APPRISE_HOST_description' => 'Apprise host URL starting with <code>http://</code> or <code>https://</code>. (don\'t forget to include <code>/notify</code> at the end)',
 'APPRISE_URL_name' => 'Apprise notification URL',
-'APPRISE_URL_description' => 'Apprise notification target URL.',
+'APPRISE_URL_description' => 'Apprise notification target URL. For example for Telegram it would be <code>tgram://{bot_token}/{chat_id}</code>.',
 
 // NTFY
+'NTFY_display_name' => 'NTFY',
+'NTFY_icon' => '<i class="fa fa-terminal"></i>',
 'REPORT_NTFY_name' => 'Enable NTFY',
 'REPORT_NTFY_description' => 'Enable sending notifications via <a target="_blank" href="https://ntfy.sh/">NTFY</a>.',
 'NTFY_HOST_name' => 'NTFY host URL',
@@ -539,13 +601,19 @@ the arp-scan will take hours to complete instead of seconds.
 'NTFY_PASSWORD_description' => 'Enter password if you need (host) an instance with enabled authetication.',
 
 // Pushsafer
+'PUSHSAFER_display_name' => 'Pushsafer',
+'PUSHSAFER_icon' => '<i class="fa fa-bell"></i>',
 'REPORT_PUSHSAFER_name' => 'Enable Pushsafer',
 'REPORT_PUSHSAFER_description' => 'Enable sending notifications via <a target="_blank" href="https://www.pushsafer.com/">Pushsafer</a>.',
 'PUSHSAFER_TOKEN_name' => 'Pushsafer token',
 'PUSHSAFER_TOKEN_description' => 'Your secret Pushsafer API key (token).',
+'APPRISE_PAYLOAD_name' => 'Payload type',
+'APPRISE_PAYLOAD_description' => 'Select the payoad type sent to Apprise. For example <code>html</code> works well with emails, <code>text</code> with chat apps, such as Telegram.',
 
 
 // MQTT
+'MQTT_display_name' => 'MQTT',
+'MQTT_icon' => '<i class="fa fa-square-rss"></i>',
 'REPORT_MQTT_name' => 'Enable MQTT',
 'REPORT_MQTT_description' => 'Enable sending notifications via <a target="_blank" href="https://www.home-assistant.io/integrations/mqtt/">MQTT</a> to your Home Assistance instance.',
 'MQTT_BROKER_name' => 'MQTT broker URL',
@@ -562,6 +630,8 @@ the arp-scan will take hours to complete instead of seconds.
 'MQTT_DELAY_SEC_description' => 'A little hack - delay adding to the queue in case the process is restarted and previous publish processes aborted (it takes ~<code>2</code>s to update a sensor config on the broker). Tested with <code>2</code>-<code>3</code> seconds of delay. This delay is only applied when devices are created (during the first notification loop). It doesn\'t affect subsequent scans or notifications.',
 
 //DynDNS
+'DynDNS_display_name' => 'DynDNS',
+'DynDNS_icon' => '<i class="fa fa-globe"></i>',
 'DDNS_ACTIVE_name' => 'Enable DynDNS',
 'DDNS_ACTIVE_description' => '',
 'DDNS_DOMAIN_name' => 'DynDNS domain URL',
@@ -574,12 +644,16 @@ the arp-scan will take hours to complete instead of seconds.
 'DDNS_UPDATE_URL_description' => 'Update URL starting with <code>http://</code> or <code>https://</code>.',
 
 // PiHole
+'PiHole_display_name' => 'PiHole',
+'PiHole_icon' => '<i class="fa fa-seedling"></i>',
 'PIHOLE_ACTIVE_name' => 'Enable PiHole mapping',
 'PIHOLE_ACTIVE_description' => 'You need to map<code>:/etc/pihole/pihole-FTL.db</code> in the <code>docker-compose.yml</code> file if you enable this setting.',
 'DHCP_ACTIVE_name' => 'Enable PiHole DHCP',
 'DHCP_ACTIVE_description' => 'You need to map <code>:/etc/pihole/dhcp.leases</code> in the <code>docker-compose.yml</code> file if you enable this setting.',
 
 // Pholus
+'Pholus_display_name' => 'Pholus',
+'Pholus_icon' => '<i class="fa fa-search"></i>',
 'PHOLUS_ACTIVE_name' => 'Cycle run',
 'PHOLUS_ACTIVE_description' => '<a href="https://github.com/jokob-sk/Pi.Alert/tree/main/pholus" target="_blank" >Pholus</a> is a sniffing tool to discover additional information about the devices on the network, including the device name. If enabled this will execute the scan before every network scan cycle until there are no <code>(unknown)</code> or <code>(name not found)</code> devices. Please be aware it can spam the network with unnecessary traffic. Depends on the <a onclick="toggleAllSettings()" href="#SCAN_SUBNETS"><code>SCAN_SUBNETS</code> setting</a>. For a scheduled or one-off scan, check the <a href="#PHOLUS_RUN"><code>PHOLUS_RUN</code> setting</a>.',
 'PHOLUS_TIMEOUT_name' => 'Cycle run timeout',
@@ -594,13 +668,15 @@ the arp-scan will take hours to complete instead of seconds.
 'PHOLUS_RUN_SCHD_description' => 'Only enabled if you select <code>schedule</code> in the <a href="#PHOLUS_RUN"><code>PHOLUS_RUN</code> setting</a>. Make sure you enter the schedule in the correct cron-like format 
 (e.g. validate at <a  href="https://crontab.guru/" target="_blank">crontab.guru</a>). For example entering <code>0 4 * * *</code> will run the scan after 4 am in the <a onclick="toggleAllSettings()" href="#TIMEZONE"><code>TIMEZONE</code> you set above</a>. Will be run NEXT time the time passes.',
 'PHOLUS_DAYS_DATA_name' => 'Data retention',
-'PHOLUS_DAYS_DATA_description' => 'How many days of Pholus scan entries should be kept (globally, not device specific!). The <a href="/maintenance.php#tab_Logging">pialert_pholus.log</a> file is not touched. Enter <code>0</code> to disable.',
+'PHOLUS_DAYS_DATA_description' => 'How many days of Pholus scan entries should be kept (globally, not device specific!) Enter <code>0</code> to disable.',
 
 // Nmap
+'Nmap_display_name' => 'Nmap',
+'Nmap_icon' => '<i class="fa fa-ethernet"></i>',
 'NMAP_ACTIVE_name' => 'Cycle run',
 'NMAP_ACTIVE_description' => 'If enabled this will execute a scan on a newly found device. For a scheduled or one-off scan, check the <a href="#NMAP_RUN"><code>NMAP_RUN</code> setting</a>.',
 'NMAP_TIMEOUT_name' => 'Run timeout',
-'NMAP_TIMEOUT_description' => 'Maximum time to wait for an Nmap scan to finish on any device.',
+'NMAP_TIMEOUT_description' => 'Maximum time in seconds to wait for an Nmap scan to finish on any device.',
 'NMAP_RUN_name' => 'Scheduled run',
 'NMAP_RUN_description' => 'Enable a regular Nmap scan on your network on all devices. The scheduling settings can be found below. If you select <code>once</code> Nmap is run only once on start for the time specified in <a href="#NMAP_TIMEOUT"><code>NMAP_TIMEOUT</code> setting</a>.',
 'NMAP_RUN_SCHD_name' => 'Schedule',
@@ -608,6 +684,16 @@ the arp-scan will take hours to complete instead of seconds.
 'NMAP_ARGS_name' => 'Arguments',
 'NMAP_ARGS_description' => 'Arguments used to run the Nmap scan. Be careful to specify <a href="https://linux.die.net/man/1/nmap" target="_blank">the arguments</a> correctly. For example <code>-p -10000</code> scans ports from 1 to 10000.',
 
+// API
+'API_display_name' => 'API',
+'API_icon' => '<i class="fa fa-arrow-down-up-across-line"></i>',
+'API_CUSTOM_SQL_name' => 'Custom endpoint',
+'API_CUSTOM_SQL_description' => 'You can specify a custom SQL query which will generate a JSON file and then expose it via the <a href="/api/table_custom_endpoint.json" target="_blank"><code>table_custom_endpoint.json</code> file endpoint</a>.',
+
+
+
+
+
 );
 
 ?>

front/php/templates/language/es_es.php

@@ -46,7 +46,7 @@ $lang['es_es'] = array(
 'Navigation_Devices' => 'Dispositivos',
 'Navigation_Presence' => 'Historial',
 'Navigation_Events' => 'Eventos',
-'Navigation_Maintenance' => 'Cantenimiento',
+'Navigation_Maintenance' => 'Mantenimiento',
 'Navigation_Settings' => 'Configuración',
 'Navigation_Network' => 'Red',
 'Navigation_HelpFAQ' => 'Ayuda / FAQ',
@@ -412,8 +412,196 @@ $lang['es_es'] = array(
 											 puertos (agrupación de puertos), así como múltiples dispositivos a un puerto (máquinas virtuales).',
 
 //////////////////////////////////////////////////////////////////
-// Settings
+// Settings (based on work of https://github.com/mariorodriguezlopez/Pi.Alert/)
 //////////////////////////////////////////////////////////////////
 
+'API_settings_group' => '<i class="fa fa-arrow-down-up-across-line"></i> API',	
+
+// General
+
+'DAYS_TO_KEEP_EVENTS_description' => 'Esta es una configuración de mantenimiento. Esto especifica el número de días de entradas de eventos que se guardarán. Todos los eventos anteriores se eliminarán periódicamente.',
+'DAYS_TO_KEEP_EVENTS_name' => 'Eliminar eventos anteriores a',
+'PIALERT_WEB_PASSWORD_description' => 'La contraseña predeterminada es <code>123456</code>. Para cambiar la contraseña, ejecute <code>/home/pi/pialert/back/pialert-cli</code> en el contenedor',
+'PIALERT_WEB_PASSWORD_name' => 'Contraseña de inicio de sesión',
+'PIALERT_WEB_PROTECTION_description' => 'Cuando está habilitado, se muestra un cuadro de diálogo de inicio de sesión. Lea detenidamente a continuación si se le bloquea el acceso a su instancia.',
+'PIALERT_WEB_PROTECTION_name' => 'Habilitar inicio de sesión',
+'REPORT_DASHBOARD_URL_description' => 'Esta URL se utiliza como base para generar enlaces en los correos electrónicos. Ingrese la URL completa que comienza con <code>http://</code>, incluido el número de puerto (sin barra inclinada al final <code>/</code>).',
+'REPORT_DASHBOARD_URL_name' => 'Pi.Alert URL',
+'REPORT_FROM_description' => 'Asunto del correo electrónico de notificación.',
+'REPORT_FROM_name' => 'Asunto del email',
+'REPORT_MAIL_description' => 'Si está habilitado, se envía un correo electrónico con una lista de cambios a los que se ha suscrito. Complete también todas las configuraciones restantes relacionadas con la configuración de SMTP a continuación',
+'REPORT_MAIL_name' => 'Habilitar email',
+'REPORT_TO_description' => 'Dirección de correo electrónico a la que se enviará la notificación.',
+	'REPORT_TO_name' => 'Enviar el email a',
+	'SCAN_CYCLE_MINUTES_description' => 'El retraso entre escaneos. Si usa arp-scan, el tiempo de escaneo en sí depende de la cantidad de direcciones IP para verificar. Esto está influenciado por la máscara de red configurada en la configuración <a href="#SCAN_SUBNETS"><code>SCAN_SUBNETS</code></a> en la parte superior. Cada IP toma un par de segundos para escanear.',
+	'SCAN_CYCLE_MINUTES_name' => 'Retraso del ciclo de escaneo',
+	'SCAN_SUBNETS_description' => 'El tiempo de escaneo arp en sí depende de la cantidad de direcciones IP para verificar.
+El número de direcciones IP para comprobar depende de la <a target="_blank" href="https://www.calculator.net/ip-subnet-calculator.html">máscara de red</a> que establezca aquí.
+Por ejemplo, una máscara <code>/24</code> da como resultado 256 IP para verificar, mientras que <code>/16</code>
+controles de máscara alrededor de 65,536. Cada IP toma un par de segundos. Esto significa que con una configuración incorrecta
+el arp-scan tardará horas en completarse en lugar de segundos.
+<ol>
+<li>Especifique la máscara de red. Por ejemplo, el filtro <code>192.168.1.0/24</code> cubre los rangos de IP 192.168.1.0 a 192.168.1.255.</li>
+<li>Ejecute <code>ifconfig</code> en su contenedor para encontrar los nombres de su interfaz (por ejemplo: <code>eth0</code>, <code>eth1</code>)</li>
+</ol>
+	',
+'SCAN_SUBNETS_name' => 'Subredes para escanear',
+'TIMEZONE_description' => 'Zona horaria para mostrar las estadísticas correctamente. Encuentra tu zona horaria<a target="_blank" href="https://en.wikipedia.org/wiki/List_of_tz_database_time_zones" rel="nofollow">aquí</a>.',
+'TIMEZONE_name' => 'Zona horaria',
+'UI_LANG_description' => 'Seleccione el idioma de interfaz de usuario preferido.',
+'UI_LANG_name' => 'Idioma de interfaz',
+
+// Email
+
+'SMTP_FORCE_SSL_description' => 'Forzar SSL al conectarse a su servidor SMTP',
+'SMTP_FORCE_SSL_name' => 'Forzar SSL',
+'SMTP_PASS_description' => 'La contraseña del servidor SMTP.',
+'SMTP_PASS_name' => 'SMTP password',
+'SMTP_PORT_description' => 'Número de puerto utilizado para la conexión SMTP. Establézcalo en <code>0</code> si no desea utilizar un puerto al conectarse al servidor SMTP.',
+'SMTP_PORT_name' => 'SMTP server PORT',
+'SMTP_SERVER_description' => 'La URL del host del servidor SMTP. Por ejemplo, <code>smtp-relay.sendinblue.com</code>. Para utilizar Gmail como servidor SMTP <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/SMTP_GMAIL.md">siga esta guía</a >',
+'SMTP_SERVER_name' => 'SMTP server URL',
+'SMTP_SKIP_LOGIN_description' => 'No utilice la autenticación cuando se conecte al servidor SMTP.',
+'SMTP_SKIP_LOGIN_name' => 'Omitir autenticación',
+'SMTP_SKIP_TLS_description' => 'Deshabilite TLS cuando se conecte a su servidor SMTP.',
+'SMTP_SKIP_TLS_name' => 'No usar TLS',
+'SMTP_USER_description' => 'El nombre de usuario utilizado para iniciar sesión en el servidor SMTP (a veces, una dirección de correo electrónico completa).',
+'SMTP_USER_name' => 'SMTP user',
+
+//API
+
+'API_CUSTOM_SQL_description' => 'Puede especificar una consulta SQL personalizada que generará un archivo JSON y luego lo expondrá a través del <a href="/api/table_custom_endpoint.json" target="_blank">archivo <code>table_custom_endpoint.json</code ></a>.',
+'API_CUSTOM_SQL_name' => 'Endpoint personalizado',
+
+
+// Apprise
+
+'APPRISE_HOST_description' => 'Apprise host URL que comienza con <code>http://</code> o <code>https://</code>. (no olvide incluir <code>/notify</code> al final)',
+'APPRISE_HOST_name' => 'Apprise host URL',
+'APPRISE_PAYLOAD_description' => 'Seleccione el tipo de carga útil enviada a Apprise. Por ejemplo, <code>html</code> funciona bien con correos electrónicos, <code>text</code> con aplicaciones de chat, como Telegram.',
+'APPRISE_PAYLOAD_name' => 'Tipo de carga',
+'APPRISE_URL_description' => 'Informar de la URL de destino de la notificación. Por ejemplo, para Telegram sería <code>tgram://{bot_token}/{chat_id}</code>.',
+'APPRISE_URL_name' => 'URL de notificación de Apprise',
+
+// Pushsafer
+'REPORT_PUSHSAFER_description' => 'Habilitar el envío de notificaciones a través de <a target="_blank" href="https://www.pushsafer.com/">Pushsafer</a>.',
+'REPORT_PUSHSAFER_name' => 'Habilitar Pushsafer',
+
+
+//DYNDNS
+
+
+'DDNS_ACTIVE_name' => 'Habilitar DynDNS',
+'DDNS_DOMAIN_name' => 'URL del dominio DynDNS',
+'DDNS_PASSWORD_name' => 'DynDNS password',
+'DDNS_UPDATE_URL_description' => 'Actualice la URL que comienza con <code>http://</code> o <code>https://</code>.',
+'DDNS_UPDATE_URL_name' => 'DynDNS update URL',
+'DDNS_USER_name' => 'DynDNS user',
+'DHCP_ACTIVE_description' => 'Debe asignar <code>:/etc/pihole/dhcp.leases</code> en el archivo <code>docker-compose.yml</code> si habilita esta configuración.',
+'DHCP_ACTIVE_name' => 'Habilitar PiHole DHCP',
+'DIG_GET_IP_ARG_description' => 'Cambie los argumentos de la <a href="https://linux.die.net/man/1/dig" target="_blank">utilidad de dig</a> si tiene problemas para resolver su IP de Internet. Los argumentos se agregan al final del siguiente comando: <code>dig +short </code>.',
+'DIG_GET_IP_ARG_name' => 'Descubrir de IP de Internet',
+
+// MQTT
+'REPORT_MQTT_description' => 'Habilitar el envío de notificaciones a través de <a target="_blank" href="https://www.home-assistant.io/integrations/mqtt/">MQTT</a> a su Home Assistance.',
+'REPORT_MQTT_name' => 'Habilitar MQTT',
+'MQTT_BROKER_description' => 'URL del host MQTT (no incluya <code>http://</code> o <code>https://</code>).',
+'MQTT_BROKER_name' => 'MQTT broker URL',
+'MQTT_DELAY_SEC_description' => 'Un pequeño truco: retrase la adición a la cola en caso de que el proceso se reinicie y los procesos de publicación anteriores se anulen (se necesitan ~<code>2</code>s para actualizar la configuración de un sensor en el intermediario). Probado con <code>2</code>-<code>3</code> segundos de retraso. Este retraso solo se aplica cuando se crean dispositivos (durante el primer bucle de notificación). No afecta los escaneos o notificaciones posteriores.',
+'MQTT_DELAY_SEC_name' => 'Retraso de MQTT por dispositivo',
+'MQTT_PASSWORD_description' => 'Contraseña utilizada para iniciar sesión en su instancia de agente de MQTT.',
+'MQTT_PASSWORD_name' => 'MQTT password',
+'MQTT_PORT_description' => 'Puerto donde escucha el broker MQTT. Normalmente <code>1883</code>.',
+'MQTT_PORT_name' => 'MQTT broker puerto',
+'MQTT_QOS_description' => 'Configuración de calidad de servicio para el envío de mensajes MQTT. <code>0</code>: baja calidad a <code>2</code>: alta calidad. Cuanto mayor sea la calidad, mayor será el retraso.',
+'MQTT_QOS_name' => 'Calidad de servicio MQTT',
+'MQTT_USER_description' => 'Nombre de usuario utilizado para iniciar sesión en su instancia de agente de MQTT.',
+'MQTT_USER_name' => 'MQTT user',
+'MQTT_settings_group' => '<i class="fa fa-square-rss"></i> MQTT',
+
+// NMAP 
+
+'NMAP_ACTIVE_description' => 'Si está habilitado, ejecutará un escaneo en un dispositivo recién encontrado. Para un análisis programado o único, verifique la configuración de <a href="#NMAP_RUN"><code>NMAP_RUN</code></a>.',
+'NMAP_ACTIVE_name' => 'Ejecución del ciclo',
+'NMAP_ARGS_description' => 'Argumentos utilizados para ejecutar el análisis de Nmap. Tenga cuidado de especificar <a href="https://linux.die.net/man/1/nmap" target="_blank">los argumentos</a> correctamente. Por ejemplo, <code>-p -10000</code> escanea los puertos del 1 al 10000.',
+'NMAP_ARGS_name' => 'Argumentos',
+'NMAP_RUN_SCHD_description' => 'Solo está habilitado si selecciona <code>programar</code> en la configuración de <a href="#NMAP_RUN"><code>NMAP_RUN</code></a>. Asegúrese de ingresar el cronograma en el formato tipo cron correcto.',
+'NMAP_RUN_SCHD_name' => 'Programar',
+'NMAP_RUN_description' => 'Habilite un escaneo regular de Nmap en su red en todos los dispositivos. Los ajustes de programación se pueden encontrar a continuación. Si selecciona <code>una vez</code>, Nmap se ejecuta solo una vez al inicio durante el tiempo especificado en la configuración de <a href="#NMAP_TIMEOUT"><code>NMAP_TIMEOUT</code></a>.',
+'NMAP_RUN_name' => 'Ejecución programada',
+'NMAP_TIMEOUT_description' => 'Tiempo máximo en segundos para esperar a que finalice un escaneo de Nmap en cualquier dispositivo.',
+
+// NTFY
+'REPORT_NTFY_description' => 'Habilitar el envío de notificaciones a través de <a target="_blank" href="https://ntfy.sh/">NTFY</a>.',
+'REPORT_NTFY_name' => 'Habilitar NTFY',
+'NTFY_HOST_description' => 'URL de host NTFY que comienza con <code>http://</code> o <code>https://</code>. Puede usar la instancia alojada en <a target="_blank" href="https://ntfy.sh/">https://ntfy.sh</a> simplemente ingresando <code>https://ntfy. sh</código>.',
+'NTFY_HOST_name' => 'NTFY host URL',
+'NTFY_PASSWORD_description' => 'Ingrese la contraseña si necesita (host) una instancia con autenticación habilitada.',
+'NTFY_PASSWORD_name' => 'NTFY password',
+'NTFY_TOPIC_name' => 'NTFY topic',
+'NTFY_USER_description' => 'Ingrese usuario si necesita (alojar) una instancia con autenticación habilitada.',
+'NTFY_USER_name' => 'NTFY user',
+'NTFY_settings_group' => '<i class="fa fa-terminal"></i> NTFY',
+
+// Pholus
+
+'Pholus_settings_group' => '<i class="fa fa-search"></i> Pholus',
+'PHOLUS_ACTIVE_description' => '<a href="https://github.com/jokob-sk/Pi.Alert/tree/main/pholus" target="_blank" >Pholus</a> es una herramienta de rastreo para descubrir información adicional sobre los dispositivos en la red, incluido el nombre del dispositivo. Si está habilitado, ejecutará el escaneo antes de cada ciclo de escaneo de red hasta que no haya dispositivos <code>(unknown)</code> o <code>(name not found)</code>. Tenga en cuenta que puede enviar spam a la red con tráfico innecesario. Depende de la configuración de <a onclick="toggleAllSettings()" href="#SCAN_SUBNETS"><code>SCAN_SUBNETS</code></a>. Para un análisis programado o único, verifique la configuración de <a href="#PHOLUS_RUN"><code>PHOLUS_RUN</code></a>.',
+'PHOLUS_ACTIVE_name' => 'Ejecución del ciclo',
+'PHOLUS_DAYS_DATA_description' => 'Cuántos días de entradas de escaneo de Pholus deben conservarse (globalmente, ¡no específico del dispositivo!). El archivo <a href="/maintenance.php#tab_Logging">pialert_pholus.log</a> no se modifica. Introduzca <code>0</code> para desactivar.',
+'PHOLUS_DAYS_DATA_name' => 'Retención de datos',
+'PHOLUS_FORCE_description' => 'Fuerce el escaneo de cada escaneo de red, incluso si no hay dispositivos <code>(unknown)</code> o <code>(name not found)</code>. Tenga cuidado al habilitar esto, ya que la detección puede inundar fácilmente su red.',
+'PHOLUS_FORCE_name' => 'Escaneo de fuerza de ciclo',
+'PHOLUS_RUN_SCHD_description' => 'Solo está habilitado si selecciona <code>programar</code> en la configuración de <a href="#PHOLUS_RUN"><code>PHOLUS_RUN</code></a>. Asegúrese de ingresar el horario en el formato similar a cron correcto
+(por ejemplo, validar en <a href="https://crontab.guru/" target="_blank">crontab.guru</a>). Por ejemplo, ingresar <code>0 4 * * *</code> ejecutará el escaneo después de las 4 am en el <a onclick="toggleAllSettings()" href="#TIMEZONE"><code>TIMEZONE</code> que configuró arriba</a>. Se ejecutará la PRÓXIMA vez que pase el tiempo.',
+'PHOLUS_RUN_SCHD_name' => 'Programar',
+'PHOLUS_RUN_TIMEOUT_description' => 'El tiempo de espera en segundos para el escaneo Pholus programado. Se aplican las mismas notas con respecto a la duración que en la configuración de <a href="#PHOLUS_TIMEOUT"><code>PHOLUS_TIMEOUT</code></a>. Un escaneo programado no verifica si hay dispositivos <code>(unknown)</code> o <code>(name not found)</code>, el escaneo se ejecuta de cualquier manera.',
+'PHOLUS_RUN_TIMEOUT_name' => 'Tiempo de espera de ejecución programado',
+'PHOLUS_RUN_description' => 'Habilite un escaneo regular de Pholus en su red. Los ajustes de programación se pueden encontrar a continuación. Si selecciona <code>una vez</code>, Pholus se ejecuta solo una vez al inicio durante el tiempo especificado en la configuración de <a href="#PHOLUS_RUN_TIMEOUT"><code>PHOLUS_RUN_TIMEOUT</code></a>.',
+'PHOLUS_RUN_name' => 'Ejecución programada',
+'PHOLUS_TIMEOUT_description' => '¿Cuánto tiempo en segundos debe rastrear Pholus en cada interfaz si se cumple la condición anterior? Cuanto más tiempo lo deje encendido, es más probable que los dispositivos transmitan más información. Este tiempo de espera se suma al tiempo que lleva realizar un escaneo arp en su red.',
+'PHOLUS_TIMEOUT_name' => 'Tiempo de espera de ciclo',
+
+// PiHole
+
+'PiHole_settings_group' => '<i class="fa fa-seedling"></i> PiHole',
+'PIHOLE_ACTIVE_description' => 'Debe mapear <code>:/etc/pihole/pihole-FTL.db</code> en el archivo <code>docker-compose.yml</code> si habilita esta configuración.',
+'PIHOLE_ACTIVE_name' => 'Habilitar el mapeo de PiHole',
+'PRINT_LOG_description' => 'Esta configuración habilitará un registro más detallado. Útil para depurar eventos que se escriben en la base de datos.',
+'PRINT_LOG_name' => 'Imprimir registro adicional',
+'PUSHSAFER_TOKEN_description' => 'Su clave secreta de la API de Pushsafer (token).',
+'PUSHSAFER_TOKEN_name' => 'Pushsafer token',
+'PUSHSAFER_settings_group' => '<i class="fa fa-bell"></i> Pushsafer',
+
+//Apprise
+
+'REPORT_APPRISE_description' => 'Habilitar el envío de notificaciones a través de <a target="_blank" href="https://hub.docker.com/r/caronc/apprise">Apprise</a>.',
+'REPORT_APPRISE_name' => 'Habilitar Apprise',
+
+// Webhooks
+'REPORT_WEBHOOK_description' => 'Habilite webhooks para notificaciones. Los webhooks lo ayudan a conectarse a muchas herramientas de terceros, como IFTTT, Zapier o <a href="https://n8n.io/" target="_blank">n8n</a>, por nombrar algunas. Consulte esta sencilla <a href="https://github.com/jokob-sk/Pi.Alert/blob/main/docs/WEBHOOK_N8N.md" target="_blank">guía de n8n aquí</a> para obtener comenzó. Si está habilitado, configure los ajustes relacionados a continuación.',
+'REPORT_WEBHOOK_name' => 'Habilitar webhooks',
+'WEBHOOK_PAYLOAD_description' => 'El formato de datos de carga de Webhook para el atributo <code>body</code> > <code>attachments</code> > <code>text</code> en el json de carga. Vea un ejemplo de la carga <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/blob/main/back/webhook_json_sample.json">aquí</a>. (por ejemplo: para discord use <code>html</code>)',
+'WEBHOOK_PAYLOAD_name' => 'Tipo de carga',
+'WEBHOOK_REQUEST_METHOD_description' => 'El método de solicitud HTTP que se utilizará para la llamada de webhook.',
+'WEBHOOK_REQUEST_METHOD_name' => 'Método de solicitud',
+'WEBHOOK_URL_description' => 'URL de destino comienza con <code>http://</code> o <code>https://</code>.',
+'WEBHOOK_URL_name' => 'URL de destino',
+'Webhooks_settings_group' => '<i class="fa fa-circle-nodes"></i> Webhooks',	
+	
+// Other
+
+'general_event_description' => 'El evento que ha activado puede tardar un tiempo hasta que finalicen los procesos en segundo plano. La ejecución terminó una vez que vea <code>finished</code> a continuación. Consulte el <a onclick=\'setCache("activeMaintenanceTab", "tab_Logging_id")\' href="/maintenance.php#tab_Logging">registro de errores</a> si no obtuvo el resultado esperado. <br/> <br/> Estado:',
+'general_event_title' => 'Ejecución de un evento ad-hoc',
+'run_event_icon' => 'fa-play',
+'run_event_tooltip' => 'Habilite la configuración y guarde sus cambios al principio antes de ejecutarlo.',
+'settings_expand_all' => 'Expandir todo',
+'settings_imported' => 'La última vez que se importó la configuración desde el archivo pialert.conf:',
+'settings_missing' => 'No se han cargado todos los ajustes, actualice la página. Esto probablemente se deba a una gran carga en la base de datos.',
+'settings_missing_block' => 'No puede guardar su configuración sin especificar todas las claves de configuración. Recarga la página. Esto probablemente se deba a una gran carga en la base de datos.',
+'settings_old' => 'La configuración en la base de datos (que se muestra en esta página) está desactualizada. Esto probablemente se deba a un análisis en ejecución. La configuración se guardó en el archivo <code>pialert.conf</code>, pero el proceso en segundo plano aún no tuvo tiempo de importarlo a la base de datos. Puede esperar hasta que la configuración se actualice para no sobrescribir sus valores anteriores. Siéntase libre de guardar su configuración de cualquier manera si no le importa perder la configuración entre la última vez que guardó y ahora. También se crean archivos de respaldo si necesita comparar su configuración más adelante.',
+'test_event_icon' => 'fa-vial-circle-check',
+'test_event_tooltip' => 'Guarde sus cambios antes de probar su configuración.',
+
 );
 ?>

front/php/templates/language/lang.php

@@ -5,22 +5,47 @@
 // ###################################
 
 $defaultLang = "en_us";
+$allLanguages = ["en_us","es_es","de_de"];
 
-if(!isset($_COOKIE["language"])) {
-  $pia_lang_selected = $defaultLang;
-} else {   
-  $pia_lang_selected = $_COOKIE["language"];
+global $db;
+
+$result = $db->querySingle("SELECT Value FROM Settings WHERE Code_Name = 'UI_LANG'"); 
+switch($result){
+  case 'Spanish': $pia_lang_selected = 'es_es'; break;
+  case 'German': $pia_lang_selected = 'de_de'; break;
+  default: $pia_lang_selected = 'en_us'; break;
 }
 
-if (isset($pia_lang_selected) == FALSE or (strlen($pia_lang_selected) == 0)) {$pia_lang_selected = defaultLang;}
+if (isset($pia_lang_selected) == FALSE or (strlen($pia_lang_selected) == 0)) {$pia_lang_selected = $defaultLang;}
 
-require 'en_us.php';
-require 'de_de.php';
-require 'es_es.php';
+//Language_Strings ("Language_Code", "String_Key", "String_Value", "Extra")
+$result = $db->query("SELECT * FROM Plugins_Language_Strings");  
+
+// array 
+$strings = array();
+while ($row = $result -> fetchArray (SQLITE3_ASSOC)) {   
+  // Push row data      
+  $strings[] = array(  'Language_Code'     => $row['Language_Code'],
+                        'String_Key'       => $row['String_Key'],                        
+                        'String_Value'     => $row['String_Value'],
+                        'Extra'            => $row['Extra']
+                      ); 
+}
+
+require dirname(__FILE__).'/../skinUI.php';
+require dirname(__FILE__).'/en_us.php';
+require dirname(__FILE__).'/de_de.php';
+require dirname(__FILE__).'/es_es.php';
 
 function lang($key)
 {
-  global $pia_lang_selected, $lang, $defaultLang;
+  global $pia_lang_selected, $lang, $defaultLang, $strings;
+
+  // get strings from the DB and append them to the ones from the files
+  foreach ($strings as $string) 
+  { 
+    $lang[$string["Language_Code"]][$string["String_Key"]] = $string["String_Value"]; 
+  }
 
   // check if key exists in selected language
   if(array_key_exists($key, $lang[$pia_lang_selected]) == FALSE) 
@@ -44,4 +69,3 @@ function lang($key)
     
   return $temp;
 }
-?>

front/php/templates/skinUI.php

@@ -4,9 +4,14 @@
 // ## GUI settings processing start
 // ###################################
 
-if (file_exists('/home/pi/pialert/db/setting_darkmode')) {
-    $ENABLED_DARKMODE = True;
+if( isset($_COOKIE['Front_Dark_Mode_Enabled']))
+{
+    $ENABLED_DARKMODE = $_COOKIE['Front_Dark_Mode_Enabled'] == "true";
+}else
+{
+    $ENABLED_DARKMODE = False;
 }
+
 foreach (glob("/home/pi/pialert/db/setting_skin*") as $filename) {
     $pia_skin_selected = str_replace('setting_','',basename($filename));
 }

front/php/templates/timezone.php

@@ -4,9 +4,9 @@
 // ## TimeZone processing start
 // ###################################
 
-$configFolderPath = "/home/pi/pialert/config/";
+$configFolderPath = dirname(__FILE__)."/../../../config/";
 $config_file = "pialert.conf";
-$logFolderPath = "/home/pi/pialert/front/log/";
+$logFolderPath = dirname(__FILE__)."/../../log/";
 $log_file = "pialert_front.log";
 
 
@@ -40,5 +40,3 @@ $timestamp = $date->format('Y-m-d_H-i-s');
 // ###################################
 // ## TimeZone processing end
 // ###################################
-
-?>

front/plugins.php

@@ -0,0 +1,469 @@
+<?php
+
+  require 'php/templates/header.php';  
+?>
+
+<script src="js/pialert_common.js"></script>
+
+<!-- Page ------------------------------------------------------------------ -->
+<div class="content-wrapper">
+
+    <!-- Content header--------------------------------------------------------- -->
+    <section class="content-header">
+        <?php require 'php/templates/notification.php'; ?>
+        <h1 id="pageTitle">
+            <i class="fa fa-fw fa-plug"></i> <?= lang('Navigation_Plugins');?>
+            <span class="pageHelp"> <a target="_blank" href="https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins"><i class="fa fa-circle-question"></i></a><span>
+        </h1>    
+    </section>
+
+    <!-- Main content ---------------------------------------------------------- -->
+    <section class="content">
+        <div class="nav-tabs-custom plugin-content" style="margin-bottom: 0px;">
+            <ul id="tabs-location" class="nav nav-tabs">
+                <!-- PLACEHOLDER -->
+            </ul>  
+            <div id="tabs-content-location" class="tab-content"> 
+                <!-- PLACEHOLDER -->
+            </div>   
+        
+    </section>    
+</div>
+
+
+
+<script defer>
+
+// -----------------------------------------------------------------------------
+// Get form control according to the column definition from config.json > database_column_definitions
+function getFormControl(dbColumnDef, value, index) {    
+
+    result = ''
+
+    switch(dbColumnDef.type)
+    {
+        case 'label':            
+            result = `<span>${value}<span>`;
+            break;
+        case 'textboxsave':
+
+            value = value == 'null' ? '' : value; // hide 'null' values
+
+            id = `${dbColumnDef.column}_${index}`
+
+            result =    `<span class="form-group">
+                            <div class="input-group">
+                                <input class="form-control" type="text" value="${value}" id="${id}" data-my-column="${dbColumnDef.column}"  data-my-index="${index}" name="${dbColumnDef.column}">
+                                <span class="input-group-addon"><i class="fa fa-save pointer" onclick="saveData('${id}');"></i></span>
+                            </div>
+                        <span>`;
+            break;
+        case 'url':
+            result = `<span><a href="${value}" target="_blank">${value}</a><span>`;
+            break;
+        case 'devicemac':
+            result = `<span class="anonymizeMac"><a href="/deviceDetails.php?mac=${value}" target="_blank">${value}</a><span>`;
+            break;
+        case 'deviceip':
+            result = `<span class="anonymizeIp"><a href="#" onclick="navigateToDeviceWithIp('${value}')" >${value}</a><span>`;
+            break;
+        case 'threshold': 
+            $.each(dbColumnDef.options, function(index, obj) {
+                if(Number(value) < obj.maximum && result == '')
+                {
+                    result = `<div style="background-color:${obj.hexColor}">${value}</div>`
+                    // return;
+                }
+            });
+            break;
+        case 'replace': 
+            $.each(dbColumnDef.options, function(index, obj) {
+                if(value == obj.equals)
+                {
+                    result = `<span title="${value}">${obj.replacement}</span>`
+                }
+            });
+            break;
+        default:
+            result = value;           
+    }
+
+    return result;
+}
+
+// -----------------------------------------------------------------------------
+// Update the coresponding DB column and entry
+function saveData (id) {
+    columnName  = $(`#${id}`).attr('data-my-column')
+    index  = $(`#${id}`).attr('data-my-index')
+    columnValue = $(`#${id}`).val()
+
+    $.get(`php/server/dbHelper.php?action=update&dbtable=Plugins_Objects&columnName=Index&id=${index}&columns=UserData&values=${columnValue}`, function(data) {
+    
+        // var result = JSON.parse(data);
+        console.log(data) 
+
+        if(sanitize(data) == 'OK')
+        {          
+          showMessage('<?= lang('Gen_DataUpdatedUITakesTime');?>')          
+          // Remove navigation prompt "Are you sure you want to leave..."
+          window.onbeforeunload = null;
+        } else
+        {
+          showMessage('<?= lang('Gen_LockedDB');?>')           
+        }        
+
+    });    
+}
+
+// -----------------------------------------------------------------------------
+// Get translated string
+function localize (obj, key) {
+
+    currLangCode = getCookie("language")
+
+    result = ""
+    en_us = ""
+
+    if(obj.localized && obj.localized.includes(key))
+    {
+        for(i=0;i<obj[key].length;i++)
+        {
+            code = obj[key][i]["language_code"]            
+
+            if( code == 'en_us')
+            {
+                en_us = obj[key][i]["string"]
+            }
+
+            if(code == currLangCode)
+            {
+                result = obj[key][i]["string"]
+            }
+
+        }
+    }
+
+    result == "" ? result = en_us : result ;
+
+    return result;
+}
+
+// -----------------------------------------------------------------------------
+pluginDefinitions = []
+pluginUnprocessedEvents = []
+pluginObjects = []
+pluginHistory = []
+
+function getData(){
+
+    $.get('api/plugins.json', function(res) {    
+        
+        pluginDefinitions = res["data"];
+
+        $.get('api/table_plugins_events.json', function(res) {
+
+            pluginUnprocessedEvents = res["data"];
+
+            $.get('api/table_plugins_objects.json', function(res) {
+
+                pluginObjects = res["data"];
+                
+                $.get('api/table_plugins_history.json', function(res) {                
+
+                    pluginHistory = res["data"];
+
+                    generateTabs()
+
+                });
+            });
+        });
+
+    });
+}
+
+// -----------------------------------------------------------------------------
+function generateTabs()
+{
+    activetab = 'active'
+
+    $.each(pluginDefinitions, function(index, obj) {
+
+        // console.log(obj)
+
+        $('#tabs-location').append(
+            `<li class=" ${activetab}">
+                <a href="#${obj.unique_prefix}" data-plugin-prefix="${obj.unique_prefix}" id="${obj.unique_prefix}_id" data-toggle="tab" >
+                ${localize(obj, 'icon')} ${localize(obj, 'display_name')}
+                </a>
+            </li>`
+        );
+        activetab = '' // only first tab is active
+    });
+
+    activetab = 'active'
+    
+    $.each(pluginDefinitions, function(index, obj) {
+
+        headersHtml = ""        
+        colDefinitions = []
+        evRows = ""
+        obRows = ""
+        hiRows = ""
+
+        // Generate the header
+        $.each(obj["database_column_definitions"], function(index, colDef){
+            if(colDef.show == true) // select only the ones to show
+            {
+                colDefinitions.push(colDef)            
+                headersHtml += `<th class="${colDef.css_classes}" >${localize(colDef, "name" )}</th>`
+            }
+        });
+
+        // Generate the event rows
+        var eveCount = 0;
+        for(i=0;i<pluginUnprocessedEvents.length;i++)
+        {
+            if(pluginUnprocessedEvents[i].Plugin == obj.unique_prefix)
+            {
+                clm = ""
+
+                for(j=0;j<colDefinitions.length;j++) 
+                {   
+                    clm += '<td>'+ pluginUnprocessedEvents[i][colDefinitions[j].column] +'</td>'
+                }                   
+                evRows += `<tr data-my-index="${pluginUnprocessedEvents[i]["Index"]}" >${clm}</tr>`
+                eveCount++;
+            }            
+        }      
+
+        // Generate the history rows        
+        var histCount = 0
+        var histCountDisplayed = 0
+        
+        for(i=pluginHistory.length-1;i >= 0;i--) // from latest to the oldest
+        {
+            if(pluginHistory[i].Plugin == obj.unique_prefix)
+            {
+                if(histCount < 50) // only display 50 entries to optimize performance
+                {       
+                    clm = ""
+
+                    for(j=0;j<colDefinitions.length;j++) 
+                    {   
+                        clm += '<td>'+ pluginHistory[i][colDefinitions[j].column] +'</td>'
+                    }            
+                    hiRows += `<tr data-my-index="${pluginHistory[i]["Index"]}" >${clm}</tr>`
+
+                    histCountDisplayed++;
+                }
+                histCount++; // count and display the total
+            }            
+        }        
+
+        // Generate the object rows
+        var obCount = 0;
+        for(var i=0;i<pluginObjects.length;i++)
+        {
+            if(pluginObjects[i].Plugin == obj.unique_prefix)
+            {
+                clm = ""
+
+                for(var j=0;j<colDefinitions.length;j++) 
+                {   
+                    clm += '<td>'+ getFormControl(colDefinitions[j], pluginObjects[i][colDefinitions[j].column], pluginObjects[i]["Index"]) +'</td>'
+                }                                   
+                obRows += `<tr data-my-index="${pluginObjects[i]["Index"]}" >${clm}</tr>`
+                obCount++;
+            }            
+        }
+
+
+        $('#tabs-content-location').append(
+            `    
+            <div id="${obj.unique_prefix}" class="tab-pane ${activetab}">
+                <div class="nav-tabs-custom" style="margin-bottom: 0px">
+                    <ul class="nav nav-tabs">
+                        <li class="active" >
+                            <a href="#objectsTarget_${obj.unique_prefix}" data-toggle="tab" >
+                                
+                                <i class="fa fa-cube"></i> <?= lang('Plugins_Objects');?> (${obCount})
+                                
+                            </a>
+                        </li>
+
+                        <li >
+                            <a href="#eventsTarget_${obj.unique_prefix}" data-toggle="tab" >
+                                
+                                <i class="fa fa-bolt"></i> <?= lang('Plugins_Unprocessed_Events');?> (${eveCount})
+                                
+                            </a>
+                        </li>
+
+                        <li >
+                            <a href="#historyTarget_${obj.unique_prefix}" data-toggle="tab" >
+                                
+                                <i class="fa fa-clock"></i> <?= lang('Plugins_History');?> (${histCountDisplayed} out of ${histCount} )
+                                
+                            </a>
+                        </li>
+
+                    <ul>
+                </div>
+                
+
+                <div class="tab-content">
+
+                    <div id="objectsTarget_${obj.unique_prefix}" class="tab-pane ${activetab}">
+                        <table class="table table-striped" data-my-dbtable="Plugins_Objects"> 
+                            <tbody>
+                                <tr>
+                                    ${headersHtml}                            
+                                </tr>  
+                                ${obRows}
+                            </tbody>
+                        </table>
+                        <div class="plugin-obj-purge">                                 
+                            <button class="btn btn-primary" onclick="purgeAll('${obj.unique_prefix}', 'Plugins_Objects' )"><?= lang('Gen_DeleteAll');?></button> 
+                        </div> 
+                    </div>
+                    <div id="eventsTarget_${obj.unique_prefix}" class="tab-pane">
+                        <table class="table table-striped" data-my-dbtable="Plugins_Events">
+                        
+                            <tbody>
+                                <tr>
+                                    ${headersHtml}                            
+                                </tr>  
+                                ${evRows}
+                            </tbody>
+                        </table>
+                        <div class="plugin-obj-purge">                                 
+                            <button class="btn btn-primary" onclick="purgeAll('${obj.unique_prefix}', 'Plugins_Events' )"><?= lang('Gen_DeleteAll');?></button> 
+                        </div> 
+                    </div>    
+                    <div id="historyTarget_${obj.unique_prefix}" class="tab-pane">
+                        <table class="table table-striped" data-my-dbtable="Plugins_History">
+                        
+                            <tbody>
+                                <tr>
+                                    ${headersHtml}                            
+                                </tr>  
+                                ${hiRows}
+                            </tbody>
+                        </table>
+                        <div class="plugin-obj-purge">                                 
+                            <button class="btn btn-primary" onclick="purgeAll('${obj.unique_prefix}', 'Plugins_History' )"><?= lang('Gen_DeleteAll');?></button> 
+                        </div> 
+                    </div>                   
+
+
+                </div>
+
+                <div class='plugins-description'>
+
+                    ${localize(obj, 'description')} 
+                
+                    <span>
+                        <a href="https://github.com/jokob-sk/Pi.Alert/tree/main/front/plugins/${obj.code_name}" target="_blank"><?= lang('Gen_Help');?></a>
+                    </span>
+                
+                </div>
+            </div>
+        `);
+
+        activetab = '' // only first tab is active
+    });
+
+    initTabs()    
+}
+
+// --------------------------------------------------------
+// handle first tab (objectsTarget_) display 
+function initTabs()
+{
+    // events on tab change
+    $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
+        var target = $(e.target).attr("href") // activated tab
+       
+        // save the last prefix
+        if(target.includes('_') == false )
+        {
+            pref = target.split('#')[1]
+        } else
+        {
+            pref = target.split('_')[1]
+        } 
+
+        everythingHidden = false;
+
+        if($('#objectsTarget_'+ pref) != undefined && $('#historyTarget_'+ pref) != undefined && $('#eventsTarget_'+ pref) != undefined)
+        {
+            everythingHidden = $('#objectsTarget_'+ pref).attr('class').includes('active') == false && $('#historyTarget_'+ pref).attr('class').includes('active') == false && $('#eventsTarget_'+ pref).attr('class').includes('active') == false;
+        }
+
+        // show the objectsTarget if no specific pane selected or if selected is hidden        
+        if((target == '#'+pref ) && everythingHidden) 
+        {
+            var classTmp = $('#objectsTarget_'+ pref).attr('class');
+
+            if($('#objectsTarget_'+ pref).attr('class').includes('active') == false)
+            {   
+                classTmp += ' active';            
+                $('#objectsTarget_'+ pref).attr('class', classTmp)
+            }
+        } 
+    });
+}
+
+// --------------------------------------------------------
+plugPrefix = ''
+dbTable    = ''
+
+function purgeAll(callback) {
+  plugPrefix = arguments[0];  // plugin prefix
+  dbTable    = arguments[1];  // DB table
+  // Ask 
+  showModalWarning('<?= lang('Gen_Purge');?>' + ' ' + plugPrefix + ' ' + dbTable , '<?= lang('Gen_AreYouSure');?>',
+    '<?= lang('Gen_Cancel');?>', '<?= lang('Gen_Okay');?>', "purgeAllExecute");
+}
+
+// --------------------------------------------------------
+function purgeAllExecute() {
+    $.ajax({
+        method: "POST",
+        url: "php/server/dbHelper.php",
+        data: { action: "delete", dbtable: dbTable, columnName: 'Plugin', id:plugPrefix },
+        success: function(data, textStatus) {
+            showModalOk ('Result', data );
+        }
+    })
+
+}
+
+// --------------------------------------------------------
+function purgeVisible() {
+
+    idArr = $(`#${plugPrefix} table[data-my-dbtable="${dbTable}"] tr[data-my-index]`).map(function(){return $(this).attr("data-my-index");}).get();
+
+    $.ajax({
+        method: "POST",
+        url: "php/server/dbHelper.php",
+        data: { action: "delete", dbtable: dbTable, columnName: 'Index', id:idArr.toString() },
+        success: function(data, textStatus) {
+            showModalOk ('Result', data );
+        }
+    })
+
+}
+
+
+// -----------------------------------------------------------------------------
+
+getData()
+
+</script>
+
+<?php
+  require 'php/templates/footer.php';
+?>
+

front/plugins/README.md

@@ -0,0 +1,455 @@
+## Overview
+
+| ![Screen 1][screen1] | ![Screen 2][screen2] | 
+|----------------------|----------------------| 
+| ![Screen 3][screen3] | ![Screen 4][screen4] | 
+
+PiAlert comes with a plugin system to feed events from third-party scripts into the UI and then send notifications, if desired. The highlighted functionality this plugin system supports, is dynamic creation of a simple UI to interact with the discovered objects, a mechanism to surface settings of plugins in the UI, or to import objects into existing PiAlert database tables. (Currently update/overwriting of existing objects is not supported.)
+
+Example use cases for plugins could be:
+
+* Monitor a web service and alert me if it's down
+* Import devices from dhcp.leases files instead/complementary to using PiHole or arp-scans
+* Creating ad-hoc UI tables from existing data in the PiAlert database, e.g. to show all open ports on devices, to list devices that disconnected in the last hour, etc.
+* Using other device discovery methods on the network and importing the data as new devices
+* Creating a script to create FAKE devices based on user input via custom settings
+* ...at this point the limitation is mostly the creativity than the capability (there might be edge cases and need to support more form controls for user input off custom settings, but you probably get the idea)
+
+If you wish to develop a plugin, please check the existing plugin structure. Once the settings are saved by the user they need to be removed from the `pialert.conf` file manually if you want to re-initialize them from the `config.json` of the plugin. 
+
+Again, please read the below carefully if you'd like to contribute with a plugin yourself. This documentation file might be outdated, so double check the sample plugins as well. 
+
+## ⚠ Disclaimer
+
+Experimental feature used also to speed up development  and to make the app more maintainable. Follow the below very carefully and check example plugin(s) if you'd like to write one yourself. Plugin UI is not my priority right now, happy to approve PRs if you are interested in extending/improvintg the UI experience. Example improvements for the taking:
+
+* Making the tables sortable/filterable
+* Using the same approach to display table  data as in the Devices section (solves above)
+* Adding form controls supported to display the data (Currently supported ones are listed in the section "UI settings in database_column_definitions" below)
+* ...
+
+## ❗ Known issues:
+
+These issues will be hopefully fixed with time, so please don't report them. Instead, if you know how, feel free to investigate and submit a PR to fix the below. Keep the PRs small as it's easier to approve them:
+
+* Existing plugin objects sometimes not interpreted correctly and a new object is created instead, resulting in duplicate entries.
+* Occasional (experienced twice) hanging of processing plugin script file.
+* UI displaying outdated values until the API endpoints get refreshed. 
+
+## Plugin file structure overview 
+
+> Folder name must be the same as the code name value in: `"code_name": "<value>"`
+> Unique prefix needs to be unique compared to the other settings prefixes, e.g.: the prefix `APPRISE` is already in use. 
+
+  | File | Required | Description | 
+  |----------------------|----------------------|----------------------| 
+  | `config.json` | yes | Contains the plugin configuration (manifest) including the settings available to the user. |
+  | `script.py` |  yes (script) | The Python script itself |
+  | `last_result.log` | yes (script) | The file used to interface between PiAlert and the plugin (script).  |
+  | `script.log` | no | Logging output (recommended) |
+  | `README.md` | no | Any setup considerations or overview (recommended) |
+
+More on specifics below.
+
+### Column order and values
+
+  | Order | Represented Column | Required | Description | 
+  |----------------------|----------------------|----------------------|----------------------| 
+  | 0 | `Object_PrimaryID` | yes | The primary ID used to group Events under. |
+  | 1 | `Object_SecondaryID` | no | Optional secondary ID to create a relationship beween other entities, such as a MAC address |
+  | 2 | `DateTime` | yes | When the event occured in the format `2023-01-02 15:56:30` |
+  | 3 | `Watched_Value1` | yes | A value that is watched and users can receive notifications if it changed compared to the previously saved entry. For example IP address |
+  | 4 | `Watched_Value2` | no | As above |
+  | 5 | `Watched_Value3` | no | As above  |
+  | 6 | `Watched_Value4` | no | As above  |
+  | 7 | `Extra` | no | Any other data you want to pass and display in PiAlert and the notifications |
+  | 8 | `ForeignKey` | no | A foreign key that can be used to link to the parent object (usually a MAC address) |
+
+
+# config.json structure
+
+## Supported data sources
+
+Currently only two data sources are supported:
+
+- Script
+- SQL query on the PiAlert database
+
+You need to set the `data_source` to either `pialert-db-query` or `python-script`:
+
+```json
+"data_source":  "pialert-db-query"
+```
+Any of the above datasources have to return a "table" of the exact structure as outlined above.
+
+### "data_source":  "python-script"
+
+ If the datasource is set to `python-script` the `CMD` setting (that you specify in the `settings` array section in the `config.json`) needs to contain a executable linux command, that generates a `last_result.log` file. This file needs to be stored in the same folder as the plugin. 
+ 
+ The content of the `last_result.log` file needs to contain the columns as defined in the "Column order and values" section above. The order of columns can't be changed. After every scan it should contain only the results from the latest scan/execution. 
+
+- The format of the `last_result.log` is a `csv`-like file with the pipe `|` as a separator. 
+- 9 (nine) values need to be supplied, so every line needs to contain 8 pipe separators. Empty values are represented by `null`.  
+- Don't render "headers" for these "columns".
+- Every scan result / event entry needs to be on a new line.
+- You can find which "columns" need to be present, and if the value is required or optional, in the "Column order and values" section. 
+- The order of these "columns" can't be changed.
+
+#### Examples
+
+Valid CSV:
+
+```csv
+
+https://www.google.com|null|2023-01-02 15:56:30|200|0.7898|null|null|null|null
+https://www.duckduckgo.com|192.168.0.1|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine|ff:ee:ff:11:ff:11
+
+```
+
+Invalid CSV with different errors on each line:
+
+```csv
+
+https://www.google.com|null|2023-01-02 15:56:30|200|0.7898||null|null|null
+https://www.duckduckgo.com|null|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine|
+|https://www.duckduckgo.com|null|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine|null
+null|192.168.1.1|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine
+https://www.duckduckgo.com|192.168.1.1|2023-01-02 15:56:30|null|0.9898|null|null|Best search engine
+https://www.google.com|null|2023-01-02 15:56:30|200|0.7898|||
+https://www.google.com|null|2023-01-02 15:56:30|200|0.7898|
+
+```
+
+### "data_source":  "pialert-db-query"
+
+If the datasource is set to `pialert-db-query` the `CMD` setting needs to contain a SQL query rendering the columns as defined in the "Column order and values" section above. The order of columns is important.
+
+#### Examples
+
+SQL query example:
+
+```SQL
+SELECT  dv.dev_Name as Object_PrimaryID, 
+    cast(dv.dev_LastIP as VARCHAR(100)) || ':' || cast( SUBSTR(ns.Port ,0, INSTR(ns.Port , '/')) as VARCHAR(100)) as Object_SecondaryID,  
+    datetime() as DateTime,  
+    ns.Service as Watched_Value1,        
+    ns.State as Watched_Value2,
+    'null' as Watched_Value3,
+    'null' as Watched_Value4,
+    ns.Extra as Extra,
+    dv.dev_MAC as ForeignKey 
+FROM 
+    (SELECT * FROM Nmap_Scan) ns 
+LEFT JOIN 
+    (SELECT dev_Name, dev_MAC, dev_LastIP FROM Devices) dv 
+ON ns.MAC = dv.dev_MAC
+```
+
+Required `CMD` setting example with above query (you can set `"type": "label"` if you want it to make uneditable in the UI):
+
+```json
+{
+            "function": "CMD",
+            "type": "text",
+            "default_value":"SELECT  dv.dev_Name as Object_PrimaryID, cast(dv.dev_LastIP as VARCHAR(100)) || ':' || cast( SUBSTR(ns.Port ,0, INSTR(ns.Port , '/')) as VARCHAR(100)) as Object_SecondaryID,  datetime() as DateTime,  ns.Service as Watched_Value1,        ns.State as Watched_Value2,        'null' as Watched_Value3,        'null' as Watched_Value4,        ns.Extra as Extra        FROM (SELECT * FROM Nmap_Scan) ns LEFT JOIN (SELECT dev_Name, dev_MAC, dev_LastIP FROM Devices) dv   ON ns.MAC = dv.dev_MAC",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "SQL to run"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "This SQL query is used to populate the coresponding UI tables under the Plugins section."
+            }]
+        }
+```
+
+### Mapping the plugin results into a database table
+
+PiAlert will take the results of the plugin execution and insert these results into a database table, if a plugin contains the property `"mapped_to_table"` in the `config.json` root. The mapping of the columns is defined in the `database_column_definitions` array.
+
+This approach is used to implement the `DHCPLSS` plugin. The script parses all supplied "dhcp.leases" files, get's the results in the generic table format outlined in the "Column order and values" section above and takes individual values and inserts them into the `"DHCP_Leases"` database table in the PiAlert database. All this is achieved by:
+
+1) Specifying the database table into which the results are inserted by defining `"mapped_to_table": "DHCP_Leases"` in the root of the `config.json` file as shown below:
+
+```json
+{
+    "code_name": "dhcp_leases",
+    "unique_prefix": "DHCPLSS",
+    ...
+    "data_source":  "python-script",
+    "localized": ["display_name", "description", "icon"],
+    "mapped_to_table": "DHCP_Leases",    
+    ...
+}
+```
+2) Defining the target column with the `mapped_to_column` property for individual columns in the `database_column_definitions` array of the `config.json` file. For example in the `DHCPLSS` plugin, I needed to map the value of the `Object_PrimaryID` column returned by the plugin, to the `DHCP_MAC` column in the PiAlert database `DHCP_Leases` table. Notice the  `"mapped_to_column": "DHCP_MAC"` key-value pair in the sample below.
+
+```json
+{
+            "column": "Object_PrimaryID",
+            "mapped_to_column": "DHCP_MAC", 
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "devicemac",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "MAC address"
+                }]
+        }
+```
+
+3)  That's it. PiAlert takes care of the rest. It loops thru the objects discovered by the plugin, takes the results line, by line and inserts them into the database table specified in `"mapped_to_table"`. The columns are translated from the generic plugin columns to the target table via the `"mapped_to_column"` property in the column definitions.
+
+#### params
+
+The `params` array in the `config.json` is used to enable the user to change the parameters of the executed script. For example, the user wants to monitor a specific URL. 
+
+##### Example:
+
+Passing user defined settings to a command. Let's say, you want to have a script, that is called with a user-defined parameter called `urls`: 
+
+```bash
+root@server# python3 /home/pi/pialert/front/plugins/website_monitor/script.py urls=https://google.com,https://duck.com
+```
+
+* You can allow the user to add URLs to a setting with the `function` property set to a custom name, such as `urls_to_check` (this is not a reserved name from the section "Supported settings `function` values" below). 
+* You specify the parameter `urls` in the `params` section of the `config.json` the following way (`WEBMON_` is the plugin prefix automatically added to all the settings):
+```json
+{
+    "params" : [
+        {
+            "name"  : "urls",
+            "type"  : "setting",
+            "value" : "WEBMON_urls_to_check"
+        }]
+}
+```
+* Then you use this setting as an input parameter for your command in the `CMD` setting. Notice `urls={urls}` in the below json:
+
+```json
+ {
+            "function": "CMD",
+            "type": "text",
+            "default_value":"python3 /home/pi/pialert/front/plugins/website_monitor/script.py urls={urls}",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Command"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Command to run"
+            }]
+        }
+```
+
+During script execution, the app will take the command `"python3 /home/pi/pialert/front/plugins/website_monitor/script.py urls={urls}"`, take the `{urls}` wildcard and replace it by with the value from the `WEBMON_urls_to_check` setting. This is because:
+
+1) The app checks the `params` entries
+2) It finds `"name"  : "urls"`
+3) Checks the type of the `urls` params and finds `"type"  : "setting"`
+4) Gets the setting name from  `"value" : "WEBMON_urls_to_check"` 
+   - IMPORTANT: in the `config.json` this setting is identified by `"function":"urls_to_check"`, not `"function":"WEBMON_urls_to_check"`
+   - You can also use a global setting, or a setting from a different plugin  
+5) The app gets the user defined value from the setting with the code name `WEBMON_urls_to_check`
+   - let's say the setting with the code name  `WEBMON_urls_to_check` contains 2 values entered by the user: 
+   - `WEBMON_urls_to_check=['https://google.com','https://duck.com']`
+6) The app takes the value from `WEBMON_urls_to_check` and replaces the `{urls}` wildcard in the setting where `"function":"CMD"`, so you go from:
+   - `python3 /home/pi/pialert/front/plugins/website_monitor/script.py urls={urls}`
+   - to
+   - `python3 /home/pi/pialert/front/plugins/website_monitor/script.py urls=https://google.com,https://duck.com` 
+
+Below are some general additional notes, when definig `params`: 
+
+- `"name":"name_value"` - is used as a wildcard replacement in the `CMD` setting value by using curly brackets `{name_value}`. The wildcard is replaced by the result of the `"value" : "param_value"` and `"type":"type_value"` combo configuration below.
+- `"type":"<sql|setting>"` - is used to specify the type of the params, currently only 2 supported (`sql`,`setting`).
+  - `"type":"sql"` - will execute the SQL query specified in the `value` property. The sql query needs to return only one column. The column is flattened and separated by commas (`,`), e.g: `SELECT dev_MAC from DEVICES` -> `Internet,74:ac:74:ac:74:ac,44:44:74:ac:74:ac`. This is then used to replace the wildcards in the `CMD` setting.  
+  - `"type":"setting"` - The setting code name. A combination of the value from `unique_prefix` + `_` + `function` value, or otherwise the code name you can find in the Settings page under the Setting dispaly name, e.g. `SCAN_CYCLE_MINUTES`. 
+- `"value" : "param_value"` - Needs to contain a setting code name or sql query without wildcards.
+
+
+Example:
+
+```json
+{
+    "params" : [{
+            "name"  : "macs",
+            "type"  : "sql",
+            "value" : "SELECT dev_MAC from DEVICES"
+        },
+        {
+            "name"  : "urls",
+            "type"  : "setting",
+            "value" : "WEBMON_urls_to_check"
+        },
+        {
+            "name"  : "internet_ip",
+            "type"  : "setting",
+            "value" : "WEBMON_SQL_internet_ip"
+        }]
+}
+```
+
+
+#### Setting object struncture
+
+- `"function": "<see Supported settings function values>"` - What function the setting drives or a simple unique code name
+- `"type": "<text|integer|boolean|password|readonly|selectinteger|selecttext|multiselect|list>"` - The form control used for the setting displayed in the Settings page and what values are accepted.
+- `"localized"` - a list of properties on the current JSON level which need to be localized
+- `"name"` and `"description"` - Displayed in the Settings page. An array of localized strings. (see Localized strings below).
+    
+##### Supported settings `function` values
+
+You can have any `"function": "my_custom_name"` custom name, however, the ones listed below have a specific functionality attached to them. If you use a custom name, then the setting is mostly used as an input parameter for the `params` section.
+
+- `RUN` - (required) Specifies when the service is executed
+    - Supported Options: "disabled", "once", "schedule" (if included then a `RUN_SCHD` setting needs to be specified), "always_after_scan", "on_new_device"
+- `RUN_SCHD` - (required if you include the above `RUN` function) Cron-like scheduling used if the `RUN` setting set to `schedule`
+- `CMD` - (required) What command should be executed. 
+- `API_SQL` - (optional) Generates a `table_` + code_name  + `.json` file as per [API docs](https://github.com/jokob-sk/Pi.Alert/blob/main/docs/API.md).
+- `RUN_TIMEOUT` - (optional) Max execution time of the script. If not specified a default value of 10 seconds is used to prevent hanging.
+- `WATCH` - (optional) Which database columns are watched for changes for this particular plugin. If not specified no notifications are sent. 
+- `REPORT_ON` - (optional) Send a notification only on these statuses. Supported options are: 
+  - `new` means a new unique (unique combination of PrimaryId and SecondaryId) object was discovered. 
+  - `watched-changed` - means that selected `Watched_ValueN` columns changed
+  - `watched-not-changed` - reports even on events where selected `Watched_ValueN` did not change
+
+
+Example:
+
+```json
+{
+    "function": "RUN",            
+    "type": "selecttext",            
+    "default_value":"disabled",
+    "options": ["disabled", "once", "schedule", "always_after_scan", "on_new_device"],
+    "localized": ["name", "description"],
+    "name" :[{
+        "language_code":"en_us",
+        "string" : "When to run"
+    }],
+    "description": [{
+        "language_code":"en_us",
+        "string" : "Enable a regular scan of your services. If you select <code>schedule</code> the scheduling settings from below are applied. If you select <code>once</code> the scan is run only once on start of the application (container) for the time specified in <a href=\"#WEBMON_RUN_TIMEOUT\"><code>WEBMON_RUN_TIMEOUT</code> setting</a>."
+    }]
+}
+```
+##### Localized strings
+
+- `"language_code":"<en_us|es_es|de_de>"`  - code name of the language string. Only these three currently supported. At least the `"language_code":"en_us"` variant has to be defined. 
+- `"string"`  - The string to be displayed in the given language.
+
+Example:
+
+```json
+
+    {
+        "language_code":"en_us",
+        "string" : "When to run"
+    }
+
+```
+##### UI settings in database_column_definitions
+
+The UI will adjust how columns are displayed in the UI based on the definition of the `database_column_definitions` object. Thease are the supported form controls and related functionality:
+
+- Only columns with `"show": true` and also with at least an English translation will be shown in the UI.
+- Supported types: `label`, `text`, `threshold`, `replace`, `deviceip`, `devicemac`, `url`. Check for details below, how columns behave based on the type.
+  - `label` makes a column display only
+  - `text` makes a column editable and a save icon is displayed next to it.
+  - See below for information on `threshold`, `replace`
+- The `options` property is used in conjunction with these types:
+  - `threshold` - The `options` array contains objects from lowest `maximum` to highest with corresponding `hexColor` used for the value background color if it's less than the specified `maximum`, but more than the previous one in the `options` array
+  - `replace` - The `options` array contains objects with an `equals` property, that is compared to the "value" and if the values are the same, the string in `replacement` is displayed in the UI instead of the actual "value"
+- `devicemac` - The value is considered to be a mac address and a link pointing to the device with the given mac address is generated.
+- `deviceip` - The value is considered to be an IP address and a link pointing to the device with the given IP is generated. The IP is cheked against the last detected IP addresses and translated into a mac address that is then used for the link itself.
+- `url` - The value is considered to be a url so a link is generated.
+
+
+```json
+{
+            "column": "Watched_Value1",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "threshold",            
+            "default_value":"",
+            "options": [
+                {
+                    "maximum": 199,
+                    "hexColor": "#792D86"                
+                },
+                {
+                    "maximum": 299,
+                    "hexColor": "#5B862D"
+                },
+                {
+                    "maximum": 399,
+                    "hexColor": "#7D862D"
+                },
+                {
+                    "maximum": 499,
+                    "hexColor": "#BF6440"
+                },
+                {
+                    "maximum": 599,
+                    "hexColor": "#D33115"
+                }
+            ],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Status code"
+                }]
+        },        
+        {
+            "column": "Status",
+            "show": true,
+            "type": "replace",            
+            "default_value":"",
+            "options": [
+                {
+                    "equals": "watched-not-changed",
+                    "replacement": "<i class='fa-solid fa-square-check'></i>"
+                },
+                {
+                    "equals": "watched-changed",
+                    "replacement": "<i class='fa-solid fa-triangle-exclamation'></i>"
+                },
+                {
+                    "equals": "new",
+                    "replacement": "<i class='fa-solid fa-circle-plus'></i>"
+                }
+            ],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Status"
+                }]
+        }
+```
+
+## Full Examples
+
+### Script based plugins
+
+- [website_monitor (WEBMON) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/website_monitor/config.json) 
+- [dhcp_servers (DHCPSRVS) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/dhcp_servers/config.json) 
+- [dhcp_leases (DHCPLSS) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/dhcp_leases/config.json) 
+- [unifi_import (UNFIMP) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/unifi_import/config.json)
+- [snmp_discovery (SNMPDSC) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/snmp_discovery/config.json)
+
+### SQL query based plugins
+- [nmap_services (NMAPSERV) config.json](https://github.com/jokob-sk/Pi.Alert/blob/main/front/plugins/nmap_services/config.json) 
+
+
+
+[screen1]: https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/plugins.png                "Screen 1"
+[screen2]: https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/plugins_settings.png       "Screen 2"
+[screen3]: https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/plugins_json_settings.png  "Screen 3"
+[screen4]: https://raw.githubusercontent.com/jokob-sk/Pi.Alert/main/docs/img/plugins_json_ui.png        "Screen 4"

front/plugins/dhcp_leases/README.md

@@ -0,0 +1,32 @@
+## Overview
+
+A plugin allowing for importing devices from DHCP.leases files.  
+
+### Usage
+
+- Specify full paths of all `dhcp.leases` files you want to import and watch in the `DHCPLSS_paths_to_check`setting.
+- Map the paths specified in the `DHCPLSS_paths_to_check`setting in your `docker-compose.yml` file.
+
+#### Example: 
+
+
+`docker-compose.yml` excerpt:
+
+```yaml
+    volumes:
+      ...
+      # mapping different dhcp.leases files
+      - /first/location/dhcp.leases:/mnt/dhcp1.leases
+      - /second/location/dhcp.leases:/mnt/dhcp2.leases      
+      ...
+```
+
+`DHCPLSS_paths_to_check` Setting: 
+
+```python
+DHCPLSS_paths_to_check = ['/mnt/dhcp1.leases','/mnt/dhcp2.leases']
+```
+
+### Notes
+
+- No specific configuration needed.

front/plugins/dhcp_leases/config.json

@@ -0,0 +1,327 @@
+{
+    "code_name": "dhcp_leases",
+    "unique_prefix": "DHCPLSS",
+    "enabled": true,    
+    "data_source":  "python-script",
+    "localized": ["display_name", "description", "icon"],
+    "mapped_to_table": "DHCP_Leases",    
+    "display_name" : [{
+        "language_code":"en_us",
+        "string" : "DHCP Leases"
+    }],
+    "icon":[{
+        "language_code":"en_us",
+        "string" : "<i class=\"fa-solid fa-hourglass-half\"></i>"
+    }],     
+    "description": [{
+        "language_code":"en_us",
+        "string" : "This plugin is to import devices from dhcp.leases files."
+    }],
+    "params" : [
+        {
+            "name"  : "paths",
+            "type"  : "setting",
+            "value" : "DHCPLSS_paths_to_check"
+        }], 
+    "database_column_definitions":
+    [          
+        {
+            "column": "Index",            
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "N/A"
+                }]
+        } ,
+        {
+            "column": "Plugin",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "N/A"
+                }]
+        },
+        {
+            "column": "Object_PrimaryID",
+            "mapped_to_column": "DHCP_MAC", 
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "devicemac",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "MAC address"
+                }]
+        },
+        {
+            "column": "Object_SecondaryID",
+            "mapped_to_column": "DHCP_IP", 
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "deviceip",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "IP"
+                }]
+        } ,
+        {
+            "column": "DateTimeCreated",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Created"
+                }]
+        },
+        {
+            "column": "DateTimeChanged",
+            "mapped_to_column": "DHCP_DateTime", 
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Changed"
+                }]
+        },
+        {
+            "column": "Watched_Value1",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Is active"
+                }]
+        },
+        {
+            "column": "Watched_Value2",
+            "mapped_to_column": "DHCP_Name", 
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Hostname"
+                }]
+        },
+        {
+            "column": "Watched_Value3",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Hardware"
+                }]
+        } ,
+        {
+            "column": "Watched_Value4",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "State"
+                }]
+        } ,       
+        {
+            "column": "UserData",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "textboxsave",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Comments"
+                }]
+        },        
+        {
+            "column": "Extra",
+            "css_classes": "col-sm-3",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "DHCP leases file"
+                }]
+        },        
+        {
+            "column": "Status",
+            "css_classes": "col-sm-1",
+            "show": true,
+            "type": "replace",            
+            "default_value":"",
+            "options": [
+                {
+                    "equals": "watched-not-changed",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-square-check'></i><div></div>"
+                },
+                {
+                    "equals": "watched-changed",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-triangle-exclamation'></i></div>"
+                },
+                {
+                    "equals": "new",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-circle-plus'></i></div>"
+                }
+            ],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Status"
+                }]
+        }            
+    ],
+    "settings":[
+        {
+            "function": "RUN",            
+            "type": "selecttext",            
+            "default_value":"disabled",
+            "options": ["disabled", "once", "schedule", "always_after_scan", "on_new_device"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "When to run"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Enable import of devices from <code>dhcp.leases</code> files. If you select <code>schedule</code> the scheduling settings from below are applied. If you select <code>once</code> the scan is run only once on start of the application (container) or after you update your settings."
+            }]
+        },
+        {
+            "function": "CMD",
+            "type": "text",
+            "default_value":"python3 /home/pi/pialert/front/plugins/dhcp_leases/script.py paths={paths}",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Command"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Command to run"
+            }]
+        },
+        {
+            "function": "paths_to_check",
+            "type": "list",
+            "default_value":["/mnt/dhcp1.leases", "/mnt/dhcp2.leases"],
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Files"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Add all dhcp.leases mapped paths to watch. Enter full path within the container, e.g. <code>/mnt/dhcp2.leases</code>. You must map these files accordingly in your <code>docker-compose.yml</code> file."
+            }]
+        },
+        {
+            "function": "RUN_SCHD",
+            "type": "text",
+            "default_value":"0 2 * * *",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Schedule"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Only enabled if you select <code>schedule</code> in the <a href=\"#DHCPLSS_RUN\"><code>DHCPLSS_RUN</code> setting</a>. Make sure you enter the schedule in the correct cron-like format (e.g. validate at <a href=\"https://crontab.guru/\" target=\"_blank\">crontab.guru</a>). For example entering <code>0 4 * * *</code> will run the scan after 4 am in the <a onclick=\"toggleAllSettings()\" href=\"#TIMEZONE\"><code>TIMEZONE</code> you set above</a>. Will be run NEXT time the time passes."
+            }]
+        },
+        {
+            "function": "RUN_TIMEOUT",
+            "type": "integer",
+            "default_value":5,
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Run timeout"
+            },
+            {
+                "language_code":"de_de",
+                "string" : "Wartezeit"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Maximum time in seconds to wait for the script to finish. If this time is exceeded the script is aborted."
+            }]
+        },
+        {
+            "function": "WATCH",
+            "type": "multiselect",
+            "default_value":["Watched_Value1", "Watched_Value4"],
+            "options": ["Watched_Value1","Watched_Value2","Watched_Value3","Watched_Value4"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "Watched"
+            }] ,
+            "description":[{
+                "language_code":"en_us",
+                "string" : "Send a notification if selected values change. Use <code>CTRL + Click</code> to select/deselect. <ul> <li><code>Watched_Value1</code> is Active </li><li><code>Watched_Value2</code> is Hostname </li><li><code>Watched_Value3</code> is hardware </li><li><code>Watched_Value4</code> is State </li></ul>"
+            }] 
+        },
+        {
+            "function": "REPORT_ON",
+            "type": "multiselect",
+            "default_value":["new","watched-changed"],
+            "options": ["new","watched-changed","watched-not-changed"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "Report on"
+            }] ,
+            "description":[{
+                "language_code":"en_us",
+                "string" : "Send a notification only on these statuses. <code>new</code> means a new unique (unique combination of PrimaryId and SecondaryId) object was discovered. <code>watched-changed</code> means that selected <code>Watched_ValueN</code> columns changed."
+            }] 
+        }
+    ]
+}
+

front/plugins/dhcp_leases/script.py

@@ -0,0 +1,116 @@
+#!/usr/bin/env python
+# Based on the work of https://github.com/leiweibau/Pi.Alert
+
+from __future__ import unicode_literals
+from time import sleep, time, strftime
+import requests
+import pathlib
+import threading
+import subprocess
+import socket
+import argparse
+import io
+import sys
+from requests.packages.urllib3.exceptions import InsecureRequestWarning
+import pwd
+import os
+from dhcp_leases import DhcpLeases
+
+curPath = str(pathlib.Path(__file__).parent.resolve())
+log_file = curPath + '/script.log'
+last_run = curPath + '/last_result.log'
+
+print(last_run)
+
+# Workflow
+
+def main():    
+
+    last_run_logfile = open(last_run, 'a') 
+
+    # empty file
+    last_run_logfile.write("")
+
+    parser = argparse.ArgumentParser(description='Import devices from dhcp.leases files')
+    parser.add_argument('paths',  action="store",  help="absolute dhcp.leases file paths to check separated by ','")  
+    values = parser.parse_args()
+
+    # parse output
+    newEntries = []
+
+    if values.paths:
+        for path in values.paths.split('=')[1].split(','):
+            
+
+            newEntries = get_entries(newEntries, path)  
+
+   
+    for e in newEntries:        
+        # Insert list into the log            
+        service_monitoring_log(e.primaryId, e.secondaryId, e.created, e.watched1, e.watched2, e.watched3, e.watched4, e.extra, e.foreignKey )
+
+
+# -----------------------------------------------------------------------------
+def service_monitoring_log(primaryId, secondaryId, created, watched1, watched2 = '', watched3 = '', watched4 = '', extra ='', foreignKey =''  ):
+    
+    if watched1 == '':
+        watched1 = 'null'
+    if watched2 == '':
+        watched2 = 'null'
+    if watched3 == '':
+        watched3 = 'null'
+    if watched4 == '':
+        watched4 = 'null'
+
+    with open(last_run, 'a') as last_run_logfile:
+        # https://www.duckduckgo.com|192.168.0.1|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine|null
+        last_run_logfile.write("{}|{}|{}|{}|{}|{}|{}|{}|{}\n".format(
+                                                primaryId,
+                                                secondaryId,
+                                                created,                                                
+                                                watched1,
+                                                watched2,
+                                                watched3,
+                                                watched4,
+                                                extra,
+                                                foreignKey
+                                                )
+                             )
+# -----------------------------------------------------------------------------
+def get_entries(newEntries, path):
+
+
+    leases = DhcpLeases(path)
+    leasesList = leases.get()
+
+    for lease in leasesList:
+
+        tmpPlugObj = plugin_object_class(lease.ethernet, lease.ip, lease.active, lease.hostname, lease.hardware, lease.binding_state, path)
+
+        newEntries.append(tmpPlugObj) 
+
+    return newEntries
+
+# -------------------------------------------------------------------
+class plugin_object_class:
+    def __init__(self, primaryId = '',secondaryId = '', watched1 = '',watched2 = '',watched3 = '',watched4 = '',extra = '',foreignKey = ''):        
+        self.pluginPref   = ''
+        self.primaryId    = primaryId
+        self.secondaryId  = secondaryId
+        self.created      = strftime("%Y-%m-%d %H:%M:%S")
+        self.changed      = ''
+        self.watched1     = watched1
+        self.watched2     = watched2
+        self.watched3     = watched3
+        self.watched4     = watched4
+        self.status       = ''
+        self.extra        = extra
+        self.userData     = ''
+        self.foreignKey   = foreignKey
+
+#===============================================================================
+# BEGIN
+#===============================================================================
+if __name__ == '__main__':    
+    main()  
+

front/plugins/dhcp_servers/README.md

@@ -0,0 +1,11 @@
+## Overview
+
+A simple sample plugin allowing for detecting rogue DHCP servers on the network.  
+
+### Usage
+
+- No specific configuration needed.
+
+### Notes
+
+- No specific configuration needed.

front/plugins/dhcp_servers/config.json

@@ -0,0 +1,302 @@
+{
+    "code_name": "dhcp_servers",
+    "unique_prefix": "DHCPSRVS",
+    "enabled": true,    
+    "data_source":  "python-script",
+    "localized": ["display_name", "description", "icon"],
+    "display_name" : [{
+        "language_code":"en_us",
+        "string" : "Rogue DHCP"
+    }],
+    "icon":[{
+        "language_code":"en_us",
+        "string" : "<i class=\"fa-solid fa-skull-crossbones\"></i>"
+    }],     
+    "description": [{
+        "language_code":"en_us",
+        "string" : "This plugin is to use NMAP to monitor for rogue DHCP servers."
+    }],
+    "params" : [],  
+    "database_column_definitions":
+    [          
+        {
+            "column": "Index",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "N/A"
+                }]
+        } ,
+        {
+            "column": "Plugin",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "N/A"
+                }]
+        },
+        {
+            "column": "Object_PrimaryID",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "deviceip",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Server Identifier"
+                }]
+        },
+        {
+            "column": "Object_SecondaryID",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Domain Name"
+                }]
+        } ,
+        {
+            "column": "DateTimeCreated",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Created"
+                }]
+        },
+        {
+            "column": "DateTimeChanged",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Changed"
+                }]
+        },
+        {
+            "column": "Watched_Value1",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Domain Name Server"
+                }]
+        },
+        {
+            "column": "Watched_Value2",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "IP Offered"
+                }]
+        },
+        {
+            "column": "Watched_Value3",
+            "css_classes": "col-sm-2",
+            "show": false,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Interface"
+                }]
+        } ,
+        {
+            "column": "Watched_Value4",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Router"
+                }]
+        } ,       
+        {
+            "column": "UserData",
+            "css_classes": "col-sm-2",
+            "show": true,
+            "type": "textboxsave",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Comments"
+                }]
+        },        
+        {
+            "column": "Status",
+            "css_classes": "col-sm-1",
+            "show": true,
+            "type": "replace",            
+            "default_value":"",
+            "options": [
+                {
+                    "equals": "watched-not-changed",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-square-check'></i><div></div>"
+                },
+                {
+                    "equals": "watched-changed",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-triangle-exclamation'></i></div>"
+                },
+                {
+                    "equals": "new",
+                    "replacement": "<div style='text-align:center'><i class='fa-solid fa-circle-plus'></i></div>"
+                }
+            ],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Status"
+                }]
+        },        
+        {
+            "column": "Extra",
+            "css_classes": "col-sm-3",
+            "show": true,
+            "type": "label",            
+            "default_value":"",
+            "options": [],
+            "localized": ["name"],
+            "name":[{
+                "language_code":"en_us",
+                "string" : "Extra info"
+                }]
+        }            
+    ],
+    "settings":[
+        {
+            "function": "RUN",            
+            "type": "selecttext",            
+            "default_value":"disabled",
+            "options": ["disabled", "once", "schedule", "always_after_scan", "on_new_device"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "When to run"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Enable a regular scan of rogue DHCP servers. If you select <code>schedule</code> the scheduling settings from below are applied. If you select <code>once</code> the scan is run only once on start of the application (container) or after you update your settings."
+            }]
+        },
+        {
+            "function": "CMD",
+            "type": "text",
+            "default_value":"python3 /home/pi/pialert/front/plugins/dhcp_servers/script.py",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Command"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Command to run"
+            }]
+        },
+        {
+            "function": "RUN_SCHD",
+            "type": "text",
+            "default_value":"0 2 * * *",
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Schedule"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Only enabled if you select <code>schedule</code> in the <a href=\"#DHCPSRVS_RUN\"><code>DHCPSRVS_RUN</code> setting</a>. Make sure you enter the schedule in the correct cron-like format (e.g. validate at <a href=\"https://crontab.guru/\" target=\"_blank\">crontab.guru</a>). For example entering <code>0 4 * * *</code> will run the scan after 4 am in the <a onclick=\"toggleAllSettings()\" href=\"#TIMEZONE\"><code>TIMEZONE</code> you set above</a>. Will be run NEXT time the time passes."
+            }]
+        },
+        {
+            "function": "RUN_TIMEOUT",
+            "type": "integer",
+            "default_value":5,
+            "options": [],
+            "localized": ["name", "description"],
+            "name" : [{
+                "language_code":"en_us",
+                "string" : "Run timeout"
+            },
+            {
+                "language_code":"de_de",
+                "string" : "Wartezeit"
+            }],
+            "description": [{
+                "language_code":"en_us",
+                "string" : "Maximum time in seconds to wait for the script to finish. If this time is exceeded the script is aborted."
+            }]
+        },
+        {
+            "function": "WATCH",
+            "type": "multiselect",
+            "default_value":["Watched_Value1"],
+            "options": ["Watched_Value1","Watched_Value2","Watched_Value3","Watched_Value4"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "Watched"
+            }] ,
+            "description":[{
+                "language_code":"en_us",
+                "string" : "Send a notification if selected values change. Use <code>CTRL + Click</code> to select/deselect. <ul> <li><code>Watched_Value1</code> is Domain Name Server</li><li><code>Watched_Value2</code> is IP Offered</li><li><code>Watched_Value3</code> is Interface </li><li><code>Watched_Value4</code> is Router </li></ul>"
+            }] 
+        },
+        {
+            "function": "REPORT_ON",
+            "type": "multiselect",
+            "default_value":["new","watched-changed"],
+            "options": ["new","watched-changed","watched-not-changed"],
+            "localized": ["name", "description"],
+            "name" :[{
+                "language_code":"en_us",
+                "string" : "Report on"
+            }] ,
+            "description":[{
+                "language_code":"en_us",
+                "string" : "Send a notification only on these statuses. <code>new</code> means a new unique (unique combination of PrimaryId and SecondaryId) object was discovered. <code>watched-changed</code> means that selected <code>Watched_ValueN</code> columns changed."
+            }] 
+        }
+    ]
+}
+

front/plugins/dhcp_servers/script.py

@@ -0,0 +1,133 @@
+#!/usr/bin/env python
+# Based on the work of https://github.com/leiweibau/Pi.Alert
+
+from __future__ import unicode_literals
+from time import sleep, time, strftime
+import requests
+import pathlib
+import threading
+import subprocess
+import socket
+import argparse
+import io
+import sys
+from requests.packages.urllib3.exceptions import InsecureRequestWarning
+import pwd
+import os
+
+curPath = str(pathlib.Path(__file__).parent.resolve())
+log_file = curPath + '/script.log'
+last_run = curPath + '/last_result.log'
+
+print(last_run)
+
+# Workflow
+
+def main():    
+
+    last_run_logfile = open(last_run, 'a') 
+
+    timeoutSec = 10
+
+    nmapArgs = ['sudo', 'nmap', '--script', 'broadcast-dhcp-discover']
+
+    # Execute N probes and insert in list
+    dhcp_probes = 1 #  N probes
+    newLines = []
+    newLines.append(strftime("%Y-%m-%d %H:%M:%S"))
+    #dhcp_server_list_time = []
+    for _ in range(dhcp_probes):
+        output = subprocess.check_output (nmapArgs, universal_newlines=True,  stderr=subprocess.STDOUT, timeout=(timeoutSec ))
+        newLines = newLines + output.split("\n")
+
+    # parse output
+    newEntries = []
+    
+    duration = "" 
+    for line in newLines:  
+        
+        if newEntries is None:
+            index = 0
+        else:    
+            index = len(newEntries) - 1 
+
+        if 'Response ' in line and ' of ' in line:            
+            newEntries.append(plugin_object_class())                        
+        elif 'Server Identifier' in line :
+            newEntries[index].primaryId = line.split(':')[1].strip()   
+        elif 'Domain Name' in line :
+            newEntries[index].secondaryId = line.split(':')[1].strip()
+        elif 'Domain Name Server' in line :
+            newEntries[index].watched1 = line.split(':')[1].strip()
+        elif 'IP Offered' in line :
+            newEntries[index].watched2 = line.split(':')[1].strip()
+        elif 'Interface' in line :
+            newEntries[index].watched3 = line.split(':')[1].strip()
+        elif 'Router' in line :
+            newEntries[index].watched4   = line.split(':')[1].strip()
+            newEntries[index].foreignKey = line.split(':')[1].strip()
+        elif ('IP Address Lease Time' in line or 'Subnet Mask' in line or 'Broadcast Address' in line) :
+
+            newVal = line.split(':')[1].strip()
+
+            if newEntries[index].extra == '':
+                newEntries[index].extra  =  newVal   
+            else: 
+                newEntries[index].extra  = newEntries[index].extra + ',' + newVal    
+
+            
+
+    for e in newEntries:        
+        # Insert list into the log            
+        service_monitoring_log(e.primaryId, e.secondaryId, e.created, e.watched1, e.watched2, e.watched3, e.watched4, e.extra, e.foreignKey )
+
+# -----------------------------------------------------------------------------
+def service_monitoring_log(primaryId, secondaryId, created, watched1, watched2 = '', watched3 = '', watched4 = '', extra ='', foreignKey =''  ):
+    
+    if watched1 == '':
+        watched1 = 'null'
+    if watched2 == '':
+        watched2 = 'null'
+    if watched3 == '':
+        watched3 = 'null'
+    if watched4 == '':
+        watched4 = 'null'
+
+    with open(last_run, 'a') as last_run_logfile:
+        # https://www.duckduckgo.com|192.168.0.1|2023-01-02 15:56:30|200|0.9898|null|null|Best search engine|null
+        last_run_logfile.write("{}|{}|{}|{}|{}|{}|{}|{}|{}\n".format(
+                                                primaryId,
+                                                secondaryId,
+                                                created,                                                
+                                                watched1,
+                                                watched2,
+                                                watched3,
+                                                watched4,
+                                                extra,
+                                                foreignKey
+                                                )
+                             )
+
+# -------------------------------------------------------------------
+class plugin_object_class:
+    def __init__(self, primaryId = '',secondaryId = '', watched1 = '',watched2 = '',watched3 = '',watched4 = '',extra = '',foreignKey = ''):        
+        self.pluginPref   = ''
+        self.primaryId    = primaryId
+        self.secondaryId  = secondaryId
+        self.created      = strftime("%Y-%m-%d %H:%M:%S")
+        self.changed      = ''
+        self.watched1     = watched1
+        self.watched2     = watched2
+        self.watched3     = watched3
+        self.watched4     = watched4
+        self.status       = ''
+        self.extra        = extra
+        self.userData     = ''
+        self.foreignKey   = foreignKey
+
+#===============================================================================
+# BEGIN
+#===============================================================================
+if __name__ == '__main__':
+    sys.exit(main())       
+