Completing the graph extension

Known issues:
- some small translations are not yet completed in gaph extension
- some small translations are not yet completed in entire frontend

Modification within the fork:
- enforce only one scancycle (crontab and frontend)
- if not already done, then sqlite3 must be installed
- DB must be patched via install/pialert_patch_DB.sh, otherwise the scan will run into an error

front/devices.php

@@ -118,7 +118,8 @@
         var pia_js_online_history_time = [<?php pia_graph_devices_data($Pia_Graph_Device_Time); ?>];
         var pia_js_online_history_ondev = [<?php pia_graph_devices_data($Pia_Graph_Device_Online); ?>];
         var pia_js_online_history_dodev = [<?php pia_graph_devices_data($Pia_Graph_Device_Down); ?>];
-        pia_draw_graph_online_history(pia_js_online_history_time, pia_js_online_history_ondev, pia_js_online_history_dodev);
+        var pia_js_online_history_ardev = [<?php pia_graph_devices_data($Pia_Graph_Device_Arch); ?>];
+        pia_draw_graph_online_history(pia_js_online_history_time, pia_js_online_history_ondev, pia_js_online_history_dodev, pia_js_online_history_ardev);
       </script>
 
 <!-- datatable ------------------------------------------------------------- -->

front/js/graph_online_history.js

@@ -1,24 +1,30 @@
-function pia_draw_graph_online_history(pia_js_graph_online_history_time, pia_js_graph_online_history_ondev, pia_js_graph_online_history_dodev) {
+function pia_draw_graph_online_history(pia_js_graph_online_history_time, pia_js_graph_online_history_ondev, pia_js_graph_online_history_dodev, pia_js_graph_online_history_ardev) {
         var xValues = pia_js_graph_online_history_time;
         new Chart("OnlineChart", {
           type: "bar",
           data: {
             labels: xValues,
             datasets: [{
-              label: 'Online Devices',
+              label: 'Online',
               data: pia_js_graph_online_history_ondev,
-              borderColor: "#00a65a",
+              borderColor: "rgba(0, 166, 89)",
               fill: true,
               backgroundColor: "rgba(0, 166, 89, .6)",
               pointStyle: 'circle',
               pointRadius: 3,
               pointHoverRadius: 3
             }, {
-              label: 'Offline/Down Devices',
+              label: 'Offline/Down',
               data: pia_js_graph_online_history_dodev,
-              borderColor: "#dd4b39",
+              borderColor: "rgba(222, 74, 56)",
               fill: true,
               backgroundColor: "rgba(222, 74, 56, .6)",
+            }, {
+              label: 'Archived',
+              data: pia_js_graph_online_history_ardev,
+              borderColor: "rgba(220,220,220)",
+              fill: true,
+              backgroundColor: "rgba(220,220,220, .6)",
             }]
           },
           options: {

front/maintenance.php

@@ -209,7 +209,7 @@ if (submit && isset($_POST['langselector_set'])) {
           <div class="col-md-12">
           <div class="box" id="Maintain-Skin">
               <div class="box-header with-border">
-                <h3 class="box-title"><?php echo $pia_lang['Maintenance_themeselector_lable'];?>:</h3>
+                <h3 class="box-title"><?php echo $pia_lang['Maintenance_themeselector_lable'];?></h3>
               </div>
               <div class="box-body">
                 <form method="post" action="maintenance.php">
@@ -255,7 +255,7 @@ if (submit && isset($_POST['langselector_set'])) {
           <div class="col-md-12">
           <div class="box" id="Maintain-Lang">
               <div class="box-header with-border">
-                <h3 class="box-title"><?php echo $pia_lang['Maintenance_lang_selector_lable'];?>:</h3>
+                <h3 class="box-title"><?php echo $pia_lang['Maintenance_lang_selector_lable'];?></h3>
               </div>
               <div class="box-body">
                 <form method="post" action="maintenance.php">
@@ -290,7 +290,7 @@ if (submit && isset($_POST['langselector_set'])) {
           <div class="col-md-12">
           <div class="box" id="Maintain-Tools">
               <div class="box-header with-border">
-                <h3 class="box-title">Tools:</h3>
+                <h3 class="box-title">Tools</h3>
               </div>
               <div class="box-body">
                 <div class="db_info_table">

front/php/templates/graph.php

@@ -3,6 +3,7 @@ $Pia_Graph_Device_Time = array();
 $Pia_Graph_Device_All = array();
 $Pia_Graph_Device_Online = array();
 $Pia_Graph_Device_Down = array();
+$Pia_Graph_Device_Arch = array();
 $db = new SQLite3('../db/pialert.db');
 $results = $db->query('SELECT * FROM Online_History ORDER BY Scan_Date DESC LIMIT 144');
 while ($row = $results->fetchArray()) {
@@ -12,6 +13,7 @@ while ($row = $results->fetchArray()) {
    array_push($Pia_Graph_Device_Down, $row['Down_Devices']);
    array_push($Pia_Graph_Device_All, $row['All_Devices']);
    array_push($Pia_Graph_Device_Online, $row['Online_Devices']);
+   array_push($Pia_Graph_Device_Arch, $row['Archived_Devices']);
 }
 function pia_graph_devices_data($Pia_Graph_Array) {
   $Pia_Graph_Array_rev = array_reverse($Pia_Graph_Array);