alignment of stat time

o_manager.py

@@ -24,6 +24,7 @@ def get_ip_address(ifname):
 
 class OManager:
     def __init__(self, base_folder, interface, base_port=8001, loop=None):
+        self.monitor_interval = 5
         self.base_folder = base_folder
         self.base_port = base_port
         self.interface = interface
@@ -45,6 +46,7 @@ class OManager:
             os.makedirs(folder_path)
         os.system(f"groupadd vpn{self.new_idx}")
         env_config = {
+            "monitor_interval": self.monitor_interval,
             "folder_path": folder_path,
             "script_template_fp": "script.sh.template",
             "proxycfg_template_fp": "3proxy.cfg.template",
@@ -90,7 +92,7 @@ class OManager:
 
     def get_stat(self, time_range=5, n_bins=60):
         stat = []
-
+        # align time range to grid defined by monitoring interval
         now = datetime.now()
         for i in self.instances:
             lines = math.ceil(time_range*60/5)
@@ -98,7 +100,7 @@ class OManager:
             first_line = True
             prev_value = None
             io_tas = TimeSeriesAccumulator(
-                start_time=now-timedelta(minutes=time_range), end_time=now, n_bins=n_bins)
+                start_time=now-timedelta(minutes=time_range), end_time=now, n_bins=n_bins, alignment=self.monitor_interval)
             for line in io_stat:
                 time, value_down, value_up = line.split(",")
                 time = datetime.utcfromtimestamp(float(time))

openvpn.py

@@ -54,6 +54,7 @@ class Openvpn:
         n_down: number of consecutive failed pings to bring connection status down, default: 2
     }
     env_config:{
+        monitor_interval: time interval between connection status monitoring in second, default: 5
         folder_path: path of the session folder
         script_template_fp: file path of script template
         proxycfg_template_fp: filepath of 3proxy config
@@ -85,6 +86,7 @@ class Openvpn:
         assert self.ping_timeout > 0, "invalid ping_timeout value"
         assert self.n_up >= 0 and self.n_down >= 0, "invalid n_up or n_down value"
 
+        self.monitor_interval = env_config.get("monitor_interval", 5)
         self.folder_path = env_config["folder_path"]
         self.script_template_fp = env_config["script_template_fp"]
         self.proxycfg_template_fp = env_config["proxycfg_template_fp"]
@@ -287,7 +289,7 @@ class Openvpn:
                 self.monitor_action()
             except Exception as e:
                 print("monitoring error:", e)
-            await asyncio.sleep(5)
+            await asyncio.sleep(self.monitor_interval)
 
     async def run_cmd(self, cmd, group):
         # print(f"run: {cmd}")

plot_gen.py

@@ -4,13 +4,19 @@ import numpy
 
 
 class TimeSeriesAccumulator:
-    def __init__(self, start_time, end_time, n_bins):
+    def __init__(self, start_time, end_time, n_bins, alignment=None):
         self.start_time = start_time
         self.start_timestamp = start_time.replace(
             tzinfo=timezone.utc).timestamp()
         self.end_time = end_time
         self.end_timestamp = end_time.replace(tzinfo=timezone.utc).timestamp()
         self.n_bins = n_bins
+
+        if alignment:
+            self.start_timestamp = (
+                self.start_timestamp//alignment) * alignment
+            self.end_timestamp = (self.end_timestamp//alignment) * alignment
+
         self.bin_time = (self.end_timestamp -
                          self.start_timestamp)/self.n_bins
         self.data = [[] for _ in range(n_bins)]

tabler/index.html

@@ -371,6 +371,20 @@
   <script src="./dist/js/tabler.min.js"></script>
 
   <script>
+    var bytesToString = function (bytes) {
+      // One way to write it, not the prettiest way to write it.
+
+      var fmt = parseInt;
+      if (bytes < 1024) {
+        return fmt(bytes) + 'B';
+      } else if (bytes < 1024 * 1024) {
+        return fmt(bytes / 1024) + 'kB';
+      } else if (bytes < 1024 * 1024 * 1024) {
+        return fmt(bytes / 1024 / 1024) + 'MB';
+      } else {
+        return fmt(bytes / 1024 / 1024 / 1024) + 'GB';
+      }
+    }
     var ctx = document.getElementById('chart-traffic').getContext('2d');
     var config = {
       type: 'line',
@@ -380,8 +394,7 @@
       options: {
         responsive: true,
         title: {
-          display: true,
+          display: false,
-          text: 'Chart.js Time Point Data'
         },
         animation: {
           duration: 0
@@ -392,7 +405,7 @@
             display: true,
             scaleLabel: {
               display: true,
-              labelString: 'Date'
+              labelString: 'Time'
             },
             ticks: {
               major: {
@@ -405,7 +418,12 @@
             display: true,
             scaleLabel: {
               display: true,
-              labelString: 'value'
+              labelString: 'Link Speed'
+            },
+            ticks: {
+              callback: function (value, index, values) {
+                return bytesToString(parseInt(value)) + "/s";
+              }
             }
           }]
         }
@@ -421,7 +439,7 @@
       });
     }
     var random = (function () {
-      var seed = 0x2F6E2B2; // 0x2F6E2B1
+      var seed = 0x2F6E2BC; // 0x2F6E2B1
       return function () {
         // Robert Jenkins’ 32 bit integer hash function
         seed = ((seed + 0x7ED55D16) + (seed << 12)) & 0xFFFFFFFF;
@@ -433,7 +451,8 @@
         return (seed & 0xFFFFFFF) / 0x10000000;
       };
     }());
-    colors = Array.from(Array(100), () => "#" + Math.floor(random() * 16777215).toString(16))
+    random();
+    colors = Array.from(Array(100), () => "#" + random().toString(16).substr(-6))
     var color = Chart.helpers.color;
 
     var update_stat = function () {
@@ -443,7 +462,7 @@
           return {
             label: value.name,
             backgroundColor: color(colors[index]).alpha(0.5).rgbString(),
-            borderColor: colors[index],
+            borderColor: color(colors[index]).alpha(0.8).rgbString(),
             fill: false,
             data: value.io_mean.map((value, index) => {
               return {
@@ -473,7 +492,7 @@
                     </td>
                     <td class="text-muted"></td>
                     <td class="text-muted"></td>
-                    <td class="text-right">
+                    <td class="text-muted">
                       <div class="chart-sparkline" id="sparkline-${index}"></div>
                     </td>
                   </tr>`