WebSVN – ALCASAR – Path Comparison – / – /web/acc/ Rev 3105 and /web/acc/ Rev 3106

Ignore whitespace Rev 3105 → Rev 3106

/web/acc/manager/vnstat/templates_c/0d0c6b8d28b17c4ffaf65435e1e6cc17f87d6e6d_0.file.module_graph_js.tpl.php
File deleted

/web/acc/manager/vnstat/templates_c/2f5e32e2f04fabdfea23a29aa98d7ff7e7a2fbf4_0.file.module_table.tpl.php
File deleted

/web/acc/manager/vnstat/templates_c/5a392efaa6cf5a3bce2bfeb15f87c356ee77a3c2_0.file.module_footer.tpl.php
File deleted

/web/acc/manager/vnstat/templates_c/553ce6260759b1d4166e3cb1ffe0a8ac55227d7c_0.file.module_graph.tpl.php
File deleted

/web/acc/manager/vnstat/templates_c/1e81c22f2b2d1f91cd03aa4725f8c35f066935d4_0.file.module_header.tpl.php
File deleted

/web/acc/manager/vnstat/templates_c/2b2bc100a3154406caafbf0c1dff8bf361bd6b94_0.file.site_index.tpl.php
File deleted

 /web/acc/manager/vnstat/alcasar.txt
 ,0 → 1,54
+Vnstat-Frontend
+code initial : https://github.com/alexandermarston/vnstat-dashboard
+Fork exploité : https://github.com/tomangert/vnstat-dashboard
+--------------------------------------------------
+diff index.php index.php.orig
+,22c21
+< //require __DIR__ . '/vendor/autoload.php';
+< require __DIR__ . '/smarty/Smarty.class.php';
+---
+> require __DIR__ . '/vendor/autoload.php';
+,55c53
+< // Add for ALCASAR
+< $thisInterface = "";
+---
+>
+d56
+< // Modify for ALCASAR
+,62c58
+< //$smarty->assign('interface_list', $vnstat->getInterfaces());
+< $smarty->assign('interface_list', $thisInterface);
+---
+> $smarty->assign('interface_list', $vnstat->getInterfaces());
+---------------------------------------------------
+diff module_footer.tpl module_footer.tpl.orig
+c3,4
+<             <span class="text-muted">Generated by 'vnstat-dashboard'
+---
+>             <span class="text-muted">Copyright (C) {$year} Alexander Marston -
+>                 <a href="https://github.com/alexandermarston/vnstat-dashboard">vnstat-dashboard</a>
+-----------------------------------------------------
+diff module_header.tpl module_header.tpl.orig
+a17,33
+>     <nav class="navbar sticky-top navbar-light bg-light">
+>         <div class="container">
+>             <a class="navbar-brand" href="#">Network Traffic ({$current_interface})</a>
+>
+>             <div class="dropdown">
+>                 <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+>                     Interface Selection
+>                 </button>
+>
+>                 <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+> {foreach from=$interface_list item=value}
+>                     <a class="dropdown-item" href="?i={$value}">{$value}</a>
+> {/foreach}
+>                 </div>
+>             </div>
+>         </div>
+>     </nav>
 Property changes:
 Added: svn:eol-style
 +native
 \ No newline at end of property

 /web/acc/manager/vnstat/includes/config.php
 ,9 → 17,10
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
-// Disable error reporting to screen
-ini_set('display_errors', 0);
-error_reporting(E_ALL);
+// Uncomment to enable error reporting to the screen
+/*ini_set('display_errors', 1);
+ini_set('display_startup_errors', 1);
+ferror_reporting(E_ALL);*/
 // Set the default system Timezone
 date_default_timezone_set('Europe/London');
 ,6 → 28,12
 // Path of vnstat
 $vnstat_bin_dir = '/usr/bin/vnstat';
+// Path of config file
+/*$vnstat_config = '/etc/vnstat.conf';*/
+// linear or logarithmic graphs. Uncomment for logarithmic
+/*$graph_type = 'log';*/
 // Set to true to set your own interfaces
 $use_predefined_interfaces = false;

 /web/acc/manager/vnstat/includes/utilities.php
 ,6 → 17,19
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
+$logk = log(1024);
+function getScale($bytes)
+{
+    global $logk;
+    $ui = floor(round(log($bytes)/$logk,3));
+    if ($ui < 0) { $ui = 0; }
+    if ($ui > 8) { $ui = 8; }
+    return $ui;
+}
 // Get the largest value in an array
 function getLargestValue($array) {
     return $max = array_reduce($array, function ($a, $b) {
 ,7 → 37,44
     });
 }
-function formatSize($bytes, $vnstatJsonVersion) {
+function getBaseValue($array, $scale)
+{
+    $big = pow(1024,9);
+    // Find the smallest non-zero value
+    $sml = array_reduce($array, function ($a, $b) {
+        if  ((1 <= $b['rx']) && ($b['rx'] < $b['tx'])) {
+            $sm = $b['rx'];
+        } else {
+            $sm = $b['tx'];
+        }
+        if (($sm < 1) || ($a < $sm)) {
+            return $a;
+        } else {
+            return $sm;
+        }
+    }, $big);
+    if ($sml >= $big/2) {
+        $sml = 1;
+    }
+    // divide by scale then round down to a power of 10
+    $base = pow(10,floor(round(log10($sml/pow(1024,$scale)),3)));
+    // convert back to bytes
+    $baseByte = $base * pow(1024, $scale);
+    // Don't make the bar invisable - must be > 5% difference
+    if ($sml / $baseByte < 1.05) {
+        $base = $base / 10;
+    }
+    return $base;
+}
+function formatSize($bytes, $vnstatJsonVersion, $decimals = 2) {
     // json version 1 = convert from KiB
     // json version 2 = convert from bytes
     if ($vnstatJsonVersion == 1) {
 ,28 → 81,29
         $bytes *= 1024;  // convert from kibibytes to bytes
     }
-    return formatBytes($bytes);
+    return formatBytes($bytes, $decimals);
 }
-function formatBytes($bytes, $decimals = 2) {
-    $base = log(floatval($bytes), 1024);
+function getLargestPrefix($scale)
+{
     $suffixes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+    return $suffixes[$scale];
+}
-    return round(pow(1024, $base - floor($base)), $decimals) .' '. $suffixes[floor($base)];
+function formatBytes($bytes, $decimals = 3) {
+    $scale = getScale($bytes);
+    return round($bytes/pow(1024, $scale), $decimals) .' '. getLargestPrefix($scale);
 }
-function formatBytesTo($bytes, $delimiter, $decimals = 2) {
+function formatBytesTo($bytes, $scale, $decimals = 4) {
     if ($bytes == 0) {
         return '0';
     }
-    $k = 1024;
-    $dm = $decimals < 0 ? 0 : $decimals;
-    $sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
-    $i = array_search($delimiter, $sizes);
-    return number_format(($bytes / pow($k, $i)), $decimals);
+    return number_format(($bytes / pow(1024, $scale)), $decimals, ".", "");
 }
 function kibibytesToBytes($kibibytes, $vnstatJsonVersion) {
 ,20 → 114,6
     }
 }
-function getLargestPrefix($kb)
-{
-    $units = ['TB', 'GB', 'MB', 'KB', 'B'];
-    $scale = 1024 * 1024 * 1024 * 1024;
-    $ui = 0;
-    while ((($kb < $scale) && ($scale > 1))) {
-        $ui++;
-        $scale = $scale / 1024;
-    }
-    return $units[$ui];
-}
 function sortingFunction($item1, $item2) {
     if ($item1['time'] == $item2['time']) {
         return 0;

 /web/acc/manager/vnstat/includes/vnstat.php
 ,7 → 78,11
                 $vnstatInterfaces = [];
                 foreach($this->vnstatData['interfaces'] as $interface) {
+                    if ($this->vnstatJsonVersion == 1) {
                         array_push($vnstatInterfaces, $interface['id']);
+                    } else {
+                        array_push($vnstatInterfaces, $interface['name']);
+                    }
                 }
                 return $vnstatInterfaces;
 ,6 → 91,7
         public function getInterfaceData($timeperiod, $type, $interface) {
                 // If json version equals 1, add an 's' onto the end of each type.
                 // e.g. 'top' becomes 'tops'
+                $typeAppend = '';
                 if ($this->vnstatJsonVersion == 1) {
                         $typeAppend = 's';
                 }
 ,9 → 98,14
                 // Blank placeholder
                 $trafficData = [];
+                $i = -1;
                 // Get the array index for the chosen interface
-                $arrayIndex = array_search($interface, array_column($this->vnstatData['interfaces'], 'id'));
+                if ($this->vnstatJsonVersion == 1) {
+                    $arrayIndex = array_search($interface, array_column($this->vnstatData['interfaces'], 'id'));
+                } else {
+                    $arrayIndex = array_search($interface, array_column($this->vnstatData['interfaces'], 'name'));
+                }
                 if ($timeperiod == 'top10') {
                         if ($type == 'table') {
 ,6 → 123,34
                         }
                 }
+                if (($this->vnstatJsonVersion > 1) && ($timeperiod == 'five')) {
+                        if ($type == 'table') {
+                                foreach ($this->vnstatData['interfaces'][$arrayIndex]['traffic']['fiveminute'] as $traffic) {
+                                        if (is_array($traffic)) {
+                                                $i++;
+                                                $trafficData[$i]['label'] = date("d/m/Y H:i", mktime($traffic['time']['hour'], $traffic['time']['minute'], 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']));
+                                                $trafficData[$i]['time'] =  mktime($traffic['time']['hour'], $traffic['time']['minute'], 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']);
+                                                $trafficData[$i]['rx'] = formatSize($traffic['rx'], $this->vnstatJsonVersion);
+                                                $trafficData[$i]['tx'] = formatSize($traffic['tx'], $this->vnstatJsonVersion);
+                                                $trafficData[$i]['total'] = formatSize(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
+                                        }
+                                }
+                        } else if ($type == 'graph') {
+                                foreach ($this->vnstatData['interfaces'][$arrayIndex]['traffic']['fiveminute'] as $traffic) {
+                                        if (is_array($traffic)) {
+                                                $i++;
+                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d, %d, %d)", $traffic['date']['year'], $traffic['date']['month']-1, $traffic['date']['day'], $traffic['time']['hour'], $traffic['time']['minute']);
+                                                $trafficData[$i]['time'] =  mktime($traffic['time']['hour'], $traffic['time']['minute'], 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']);
+                                                $trafficData[$i]['rx'] = kibibytesToBytes($traffic['rx'], $this->vnstatJsonVersion);
+                                                $trafficData[$i]['tx'] = kibibytesToBytes($traffic['tx'], $this->vnstatJsonVersion);
+                                                $trafficData[$i]['total'] = kibibytesToBytes(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
+                                        }
+                                }
+                        }
+                }
                 if ($timeperiod == 'hourly') {
                         if ($type == 'table') {
                                 foreach ($this->vnstatData['interfaces'][$arrayIndex]['traffic']['hour'.$typeAppend] as $traffic) {
 ,7 → 171,6
                                         }
                                 }
-                               // usort($trafficData, sortingFunction);
                         } else if ($type == 'graph') {
                                 foreach ($this->vnstatData['interfaces'][$arrayIndex]['traffic']['hour'.$typeAppend] as $traffic) {
 ,7 → 183,8
                                                     $hour = $traffic['time']['hour'];
                                                 }
-                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d, %d, %d, %d)", $traffic['date']['year'], $traffic['date']['month']-1, $traffic['date']['day'], $hour, 0, 0);
+                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d, %d)", $traffic['date']['year'], $traffic['date']['month']-1, $traffic['date']['day'], $hour);
+                                                $trafficData[$i]['time'] =  mktime($hour, 0, 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']);
                                                 $trafficData[$i]['rx'] = kibibytesToBytes($traffic['rx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['tx'] = kibibytesToBytes($traffic['tx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['total'] = kibibytesToBytes(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
 ,6 → 200,7
                                                 $i++;
                                                 $trafficData[$i]['label'] = date('d/m/Y', mktime(0, 0, 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']));
+                                                $trafficData[$i]['time'] =  mktime(0, 0, 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']);
                                                 $trafficData[$i]['rx'] = formatSize($traffic['rx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['tx'] = formatSize($traffic['tx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['total'] = formatSize(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
 ,7 → 211,8
                                         if (is_array($traffic)) {
                                                 $i++;
-                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d, %d, %d, %d)", $traffic['date']['year'], $traffic['date']['month']-1, $traffic['date']['day'], 0, 0, 0);
+                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d)", $traffic['date']['year'], $traffic['date']['month']-1, $traffic['date']['day']);
+                                                $trafficData[$i]['time'] =  mktime(0, 0, 0, $traffic['date']['month'], $traffic['date']['day'], $traffic['date']['year']);
                                                 $trafficData[$i]['rx'] = kibibytesToBytes($traffic['rx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['tx'] = kibibytesToBytes($traffic['tx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['total'] = kibibytesToBytes(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
 ,6 → 228,7
                                                 $i++;
                                                 $trafficData[$i]['label'] = date('F Y', mktime(0, 0, 0, $traffic['date']['month'], 10, $traffic['date']['year']));
+                                                $trafficData[$i]['time'] =  mktime(0, 0, 0, $traffic['date']['month'], 10, $traffic['date']['year']);
                                                 $trafficData[$i]['rx'] = formatSize($traffic['rx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['tx'] = formatSize($traffic['tx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['total'] = formatSize(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
 ,7 → 239,8
                                         if (is_array($traffic)) {
                                                 $i++;
-                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d, %d, %d, %d)", $traffic['date']['year'], $traffic['date']['month'] - 1, 10, 0, 0, 0);
+                                                $trafficData[$i]['label'] = sprintf("Date(%d, %d, %d)", $traffic['date']['year'], $traffic['date']['month'] - 1, 10);
+                                                $trafficData[$i]['time'] =  mktime(0, 0, 0, $traffic['date']['month'], 10, $traffic['date']['year']);
                                                 $trafficData[$i]['rx'] = kibibytesToBytes($traffic['rx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['tx'] = kibibytesToBytes($traffic['tx'], $this->vnstatJsonVersion);
                                                 $trafficData[$i]['total'] = kibibytesToBytes(($traffic['rx'] + $traffic['tx']), $this->vnstatJsonVersion);
 ,17 → 249,32
                         }
                 }
+                if ($timeperiod != 'top10') {
+                    usort($trafficData, 'sortingFunction');
+                }
                 if ($type == 'graph') {
                     // Get the largest value and then prefix (B, KB, MB, GB, etc)
                     $trafficLargestValue = getLargestValue($trafficData);
-                    $trafficLargestPrefix = getLargestPrefix($trafficLargestValue);
+                    $trafficScale = getScale($trafficLargestValue);
+                    $trafficLargestPrefix = getLargestPrefix($trafficScale);
+                    $trafficBase = getBaseValue($trafficData, $trafficScale);
+                    if (($trafficBase < .0099) && ($trafficScale >= 1))
+                    {
+                        $trafficScale = $trafficScale - 1;
+                        $trafficLargestPrefix = getLargestPrefix($trafficScale);
+                        $trafficBase = getBaseValue($trafficData, $trafficScale);
+                    }
-                    foreach($trafficData as $key => $value) {
-                        $trafficData[$key]['rx'] = formatBytesTo($value['rx'], $trafficLargestPrefix);
-                        $trafficData[$key]['tx'] = formatBytesTo($value['tx'], $trafficLargestPrefix);
-                        $trafficData[$key]['total'] = formatBytesTo($value['total'], $trafficLargestPrefix);
-                        $trafficData[$key]['delimiter'] = $trafficLargestPrefix;
+                    foreach($trafficData as &$value) {
+                        $value['rx'] = formatBytesTo($value['rx'], $trafficScale);
+                        $value['tx'] = formatBytesTo($value['tx'], $trafficScale);
+                        $value['total'] = formatBytesTo($value['total'], $trafficScale);
                     }
+                    unset($value);
+                    $trafficData[0]['delimiter'] = $trafficLargestPrefix;
+                    $trafficData[0]['base'] = $trafficBase;
                 }
                 return $trafficData;

 /web/acc/manager/vnstat/templates/module_footer.tpl
 ,8 → 5,8
         </div>
     </footer>
     <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
-    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
-    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
+    <script src="/js/jquery.slim.min.js"></script>
+    <script src="/js/bootstrap.min.js"></script>
 {include file="module_graph_js.tpl"}
 </body>
 </html>

 /web/acc/manager/vnstat/templates/module_graph.tpl
 ,9 → 1,18
     <div class="container">
         <ul class="nav nav-tabs" id="graphTab" role="tablist">
+            {if $jsonVersion gt 1}
+                <li class="nav-item">
+                    <a class="nav-link active" id="five-graph-tab" data-toggle="tab" href="#five-graph" role="tab" aria-controls="five-graph" aria-selected="true">Five Minute Graph</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" id="hourly-graph-tab" data-toggle="tab" href="#hourly-graph" role="tab" aria-controls="hourly-graph" aria-selected="false">Hourly Graph</a>
+                </li>
+            {else}
+                <li class="nav-item">
+                    <a class="nav-link active" id="hourly-graph-tab" data-toggle="tab" href="#hourly-graph" role="tab" aria-controls="hourly-graph" aria-selected="true">Hourly Graph</a>
+                </li>
+            {/if}
             <li class="nav-item">
-                <a class="nav-link active" id="hourly-graph-tab" data-toggle="tab" href="#hourly-graph" role="tab" aria-controls="hourly-graph" aria-selected="true">Hourly Graph</a>
-            </li>
-            <li class="nav-item">
                 <a class="nav-link" id="daily-graph-tab" data-toggle="tab" href="#daily-graph" role="tab" aria-controls="daily-graph" aria-selected="false">Daily Graph</a>
             </li>
             <li class="nav-item">
 ,10 → 21,20
         </ul>
         <div class="tab-content">
-            <div class="tab-pane fade show active" id="hourly-graph" role="tabpanel" aria-labelledby="hourly-graph-tab">
-                <div id="hourlyNetworkTrafficGraph" style="height: 300px;"></div>
-            </div>
+            {if $jsonVersion gt 1}
+                <div class="tab-pane fade show active" id="five-graph" role="tabpanel" aria-labelledby="five-graph-tab">
+                    <div id="fiveNetworkTrafficGraph" style="height: 300px;"></div>
+                </div>
+                <div class="tab-pane fade" id="hourly-graph" role="tabpanel" aria-labelledby="hourly-graph-tab">
+                    <div id="hourlyNetworkTrafficGraph" style="height: 300px;"></div>
+                </div>
+            {else}
+                <div class="tab-pane fade show active" id="hourly-graph" role="tabpanel" aria-labelledby="hourly-graph-tab">
+                    <div id="hourlyNetworkTrafficGraph" style="height: 300px;"></div>
+                </div>
+            {/if}
             <div class="tab-pane fade" id="daily-graph" role="tabpanel" aria-labelledby="daily-graph-tab">
                 <div id="dailyNetworkTrafficGraph" style="height: 300px;"></div>
             </div>

 /web/acc/manager/vnstat/templates/module_graph_js.tpl
 ,11 → 1,80
     <script type="text/javascript">
         google.charts.load('current', { packages: [ 'bar' ] });
         google.charts.load("current", { packages: [ 'corechart' ] });
+        google.charts.setOnLoadCallback(drawFiveChart);
         google.charts.setOnLoadCallback(drawHourlyChart);
         google.charts.setOnLoadCallback(drawDailyChart);
         google.charts.setOnLoadCallback(drawMonthlyChart);
+        function drawFiveChart()
+        {
+            {if $jsonVersion gt 1}
+            var data = new google.visualization.DataTable();
+            data.addColumn('datetime', 'Time');
+            data.addColumn('number', 'Traffic In');
+            data.addColumn('number', 'Traffic Out');
+            data.addColumn('number', 'Total Traffic');
+            data.addRows([
+{foreach from=$fiveGraphData key=key item=value}
+                [new {$value.label}, {$value.rx}, {$value.tx}, {$value.total}],
+{/foreach}
+            ]);
+            let endD = (new {$fiveGraphData[0]['label']}).getTime();
+            let options = {
+                title: 'Five minute Network Traffic',
+                orientation: 'horizontal',
+                legend: { position: 'right' },
+                explorer: {
+                    axis: 'horizontal',
+                    zoomDelta: 1.1,
+                    maxZoomIn: 0.1,
+                    maxZoomOut: 10.0
+                },
+                vAxis: {
+                    format: '###.### {$fiveLargestPrefix}'
+                    {if $graph_type == 'log'}
+                        ,scaleType: 'log',
+                        baseline: {$fiveBase}
+                    {/if}
+                },
+                hAxis: {
+                    direction: -1,
+                    format: 'd/H:mm',
+                    {if $jsonVersion > 1}
+                        title: 'Day/Hour:Minute (Scroll to zoom, Drag to pan)',
+                    {else}
+                        title: 'Day/Hour:Minute',
+                    {/if}
+                    viewWindow: {
+                        min: 'Date('+(endD-7050000).toString()+')',
+                        max: 'Date('+(endD+150000).toString()+')'
+                    },
+                    ticks: [
+{foreach from=$fiveGraphData key=key item=value}
+                        new {$value.label},
+{/foreach}
+                    ]
+                }
+            };
+            var formatDate = new google.visualization.DateFormat({ pattern: 'dd/MM/yyyy HH:mm' });
+            formatDate.format(data, 0);
+            var formatNumber = new google.visualization.NumberFormat({ pattern: '##.## {$fiveLargestPrefix}' });
+            formatNumber.format(data, 1);
+            formatNumber.format(data, 2);
+            formatNumber.format(data, 3);
+            let chart = new google.visualization.BarChart(document.getElementById('fiveNetworkTrafficGraph'));
+            chart.draw(data, google.charts.Bar.convertOptions(options));
+            {/if}
+        }
         function drawHourlyChart()
         {
             var data = new google.visualization.DataTable();
 ,6 → 90,8
 {/foreach}
             ]);
+            let endD = (new {$hourlyGraphData[0]['label']}).getTime();
             let options = {
                 title: 'Hourly Network Traffic',
                 orientation: 'horizontal',
 ,17 → 98,29
                 legend: { position: 'right' },
                 explorer: {
                     axis: 'horizontal',
-                    maxZoomIn: 4.0,
-                    maxZoomOut: 3.0
+                    zoomDelta: 1.1,
+                    maxZoomIn: 0.1,
+                    maxZoomOut: 10.0
                 },
                 vAxis: {
-                    title: 'Data',
-                    format: '##.## {$hourlyLargestPrefix}'
+                    format: '###.### {$hourlyLargestPrefix}'
+                    {if $graph_type == 'log'}
+                        ,scaleType: 'log',
+                        baseline: {$hourlyBase}
+                    {/if}
                 },
                 hAxis: {
-                    title: 'Hour',
-                    format: 'HH:mm',
+                    {if $jsonVersion > 1}
+                        title: 'Day/Hour (Scroll to zoom, Drag to pan)',
+                    {else}
+                        title: 'Day/Hour',
+                    {/if}
+                    format: 'd/H',
                     direction: -1,
+                    viewWindow: {
+                        min: 'Date('+(endD-84600000).toString()+')',
+                        max: 'Date('+(endD+1800000).toString()+')'
+                    },
                     ticks: [
 {foreach from=$hourlyGraphData key=key item=value}
                         new {$value.label},
 ,7 → 155,9
                 [new {$value.label}, {$value.rx}, {$value.tx}, {$value.total}],
 {/foreach}
             ]);
+            let endD = (new {$dailyGraphData[0]['label']}).getTime();
             let options = {
                 title: 'Daily Network Traffic',
                 orientation: 'horizontal',
 ,20 → 164,37
                 legend: { position: 'right' },
                 explorer: {
                     axis: 'horizontal',
-                    maxZoomIn: 4.0,
-                    maxZoomOut: 3.0
+                    zoomDelta: 1.1,
+                    maxZoomIn: 0.1,
+                    maxZoomOut: 10.0
                 },
                 vAxis: {
-                    title: 'Data',
-                    format: '##.## {$dailyLargestPrefix}'
+                    format: '###.### {$dailyLargestPrefix}'
+                    {if $graph_type == 'log'}
+                        ,scaleType: 'log',
+                        baseline: {$dailyBase}
+                    {/if}
                 },
                 hAxis: {
-                    title: 'Day',
+                    {if $jsonVersion > 1}
+                        title: 'Day (Scroll to zoom, Drag to pan)',
+                    {else}
+                        title: 'Day',
+                    {/if}
                     format: 'dd/MM/YYYY',
-                    direction: -1
+                    viewWindow: {
+                        min: 'Date('+(endD-2548800000).toString()+')',
+                        max: 'Date('+(endD+43200000).toString()+')'
+                    },
+                    direction: -1,
+                    ticks: [
+{foreach from=$dailyGraphData key=key item=value}
+                        new {$value.label},
+{/foreach}
+                    ]
                 }
             };
             var formatDate = new google.visualization.DateFormat({ pattern: 'dd/MM/yyyy' });
             formatDate.format(data, 0);
 ,11 → 228,11
                 legend: { position: 'right' },
                 explorer: {
                     axis: 'horizontal',
-                    maxZoomIn: 4.0,
-                    maxZoomOut: 3.0
+                    zoomDelta: 1.1,
+                    maxZoomIn: 0.1,
+                    maxZoomOut: 10.0
                 },
                 vAxis: {
-                    title: 'Data',
                     format: '##.## {$monthlyLargestPrefix}'
                 },
                 hAxis: {

 /web/acc/manager/vnstat/templates/module_table.tpl
 ,9 → 1,18
     <div class="container">
         <ul class="nav nav-tabs" id="tableTab" role="tablist">
+            {if $jsonVersion gt 1}
+                <li class="nav-item">
+                    <a class="nav-link active" id="five-table-tab" data-toggle="tab" href="#five-table" role="tab" aria-controls="five-table" aria-selected="true">Five Minute</a>
+                </li>
+                <li class="nav-item">
+                    <a class="nav-link" id="hourly-table-tab" data-toggle="tab" href="#hourly-table" role="tab" aria-controls="hourly-table" aria-selected="false">Hourly</a>
+                </li>
+                {else}
+                <li class="nav-item">
+                    <a class="nav-link active" id="hourly-table-tab" data-toggle="tab" href="#hourly-table" role="tab" aria-controls="hourly-table" aria-selected="true">Hourly</a>
+                </li>
+            {/if}
             <li class="nav-item">
-                <a class="nav-link active" id="hourly-table-tab" data-toggle="tab" href="#hourly-table" role="tab" aria-controls="hourly-table" aria-selected="true">Hourly</a>
-            </li>
-            <li class="nav-item">
                 <a class="nav-link" id="daily-table-tab" data-toggle="tab" href="#daily-table" role="tab" aria-controls="daily-table" aria-selected="false">Daily</a>
             </li>
             <li class="nav-item">
 ,7 → 24,34
         </ul>
         <div class="tab-content" id="tableTabContent">
+            {if $jsonVersion gt 1}
+            <div class="tab-pane fade show active" id="five-table" role="tabpanel" aria-labelledby="five-table-tab">
+                <table class="table table-bordered">
+                    <thead>
+                        <tr>
+                            <th>Time</th>
+                            <th>Received</th>
+                            <th>Sent</th>
+                            <th>Total</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+{foreach from=$fiveTableData key=key item=value}
+                        <tr>
+                            <td>{$value.label}</td>
+                            <td>{$value.rx}</td>
+                            <td>{$value.tx}</td>
+                            <td>{$value.total}</td>
+                        </tr>
+{/foreach}
+                    </tbody>
+                </table>
+            </div>
+            <div class="tab-pane fade" id="hourly-table" role="tabpanel" aria-labelledby="hourly-table-tab">
+            {else}
             <div class="tab-pane fade show active" id="hourly-table" role="tabpanel" aria-labelledby="hourly-table-tab">
+            {/if}
                 <table class="table table-bordered">
                     <thead>
                         <tr>

Subversion Repositories ALCASAR

Compare Revisions

Ignore whitespace Rev 3105 → Rev 3106