Use chart.js for statistics

Signed-off-by: Janos SUTO <sj@acts.hu>

webui/controller/stat/stat.php

@@ -15,6 +15,7 @@ class ControllerStatStat extends Controller {
       $db = Registry::get('db');
 
       $this->load->model('user/user');
+      $this->load->model('stat/chart');
 
       $this->document->title = $this->data['text_statistics'];
 
@@ -24,10 +25,19 @@ class ControllerStatStat extends Controller {
       $this->data['admin_user'] = Registry::get('admin_user');
       $this->data['readonly_admin'] = Registry::get('readonly_admin');
 
+      $this->data['username'] = Registry::get('username');
+
+      $timespan = @$this->request->get['timespan'];
+
+      $db->select_db($db->database);
+
+      $chart = new ModelStatChart();
+
+      $this->data['data'] = $chart->lineChartArchivedMessages($timespan);
+
+
       $this->render();
    }
 
 
 }
-
-?>

webui/model/stat/chart.php

@@ -2,23 +2,11 @@
 
 class ModelStatChart extends Model {
 
-   public function lineChartHamSpam($timespan, $title, $size_x, $size_y, $output){
-      $ydata = array();
-      $ydata2 = array();
-      $dates = array();
+   public function lineChartArchivedMessages($timespan){
+      $data = [];
 
       $session = Registry::get('session');
 
-      $chart = new LineChart($size_x, $size_y);
-
-      $chart->getPlot()->getPalette()->setLineColor(array(
-         new Color(208, 48, 128),
-      ));
-
-      $line1 = new XYDataSet();
-
-      $limit = $this->getDataPoints($timespan);
-
       $range = $this->getRangeInSeconds($timespan);
 
       if($timespan == "daily"){ $grouping = "GROUP BY FROM_UNIXTIME(ts, '%Y.%m.%d. %H')"; }
@@ -27,10 +15,18 @@ class ModelStatChart extends Model {
 
       if($timespan == "daily"){
          $delta = 3600;
-         $date_format = "H:i";
+         $data_points = 24;
       } else {
          $delta = 86400;
-         $date_format = "m.d.";
+         $data_points = 30;
+      }
+
+      $now = time();
+      $now -= $now % $delta + ($data_points-1)*$delta;
+
+      for($i=0; $i<$data_points; $i++) {
+         $data[$now] = 0;
+         $now += $delta;
       }
 
       if(Registry::get('admin_user') == 0) {
@@ -42,57 +38,18 @@ class ModelStatChart extends Model {
             if($q) { $q .= ",?"; } else { $q = "?"; }
          }
          reset($auditdomains);
-         $query = $this->db->query("select (arrived-(arrived%$delta)) as ts, count(*) as num from " . VIEW_MESSAGES . " where arrived > $range AND todomain IN ($q) $domains $grouping ORDER BY ts DESC limit $limit", $auditdomains);
+         $query = $this->db->query("select (arrived-(arrived%$delta)) as ts, count(*) as num from " . VIEW_MESSAGES . " where arrived > $range AND todomain IN ($q) $domains $grouping ORDER BY ts DESC limit $data_points", $auditdomains);
       } else {
-         $query = $this->db->query("select (arrived-(arrived%$delta)) as ts, count(*) as num from " . TABLE_META . " where arrived > $range $grouping ORDER BY ts DESC limit $limit");
+         $query = $this->db->query("select (arrived-(arrived%$delta)) as ts, count(*) as num from " . TABLE_META . " where arrived > $range $grouping ORDER BY ts DESC limit $data_points");
       }
 
-
       foreach ($query->rows as $q) {
-         array_push($ydata, $q['num']);
-         array_push($dates, date($date_format, $q['ts']));
+         if(isset($data[$q['ts']])) {
+            $data[$q['ts']] = $q['num'];
+         }
       }
 
-      // If there's a single data point, then we can't draw a line
-      // so we add an artificial value of 0
-      if(count($ydata) <= 1) {
-         if($timespan == "daily") {
-            $ts = NOW - (NOW % 3600) - 3600;
-         } else {
-            $ts = NOW - (NOW % 86400) - 86400;
-         }
-
-         array_push($ydata, 0);
-         array_push($dates, date($date_format, $ts));
-      }
-
-
-      if($query->num_rows >= 15) {
-         $i = 0;
-         foreach($dates as $k => $v) {
-            $i++;
-            if($i % 3) { $dates[$k] = ""; }
-         }
-         reset($dates);
-      }
-
-
-
-      $ydata = array_reverse($ydata);
-      $dates = array_reverse($dates);
-
-      for($i=0; $i<count($ydata); $i++){
-         $ts = $dates[$i];
-         $line1->addPoint(new Point("$ts", $ydata[$i]));
-      }
-
-
-      $chart->setDataSet($line1);
-
-      $chart->setTitle($title);
-      $chart->getPlot()->setGraphCaptionRatio(0.80);
-
-      $this->sendOutput($chart, $output);
+      return $data;
    }
 
 

webui/view/theme/default/templates/stat/stat.tpl

@@ -1,12 +1,42 @@
 <p>
 
-<?php if($timespan == "daily"){ ?>
+<?php if($timespan == "daily"){ $date_format = "H:i"; ?>
 <strong><?php print $text_daily_report; ?></strong> <a href="index.php?route=stat/stat&amp;timespan=monthly<?php if(isset($uid)) { ?>&amp;uid=<?php print $uid; } ?>"><?php print $text_monthly_report; ?></a>
-<?php } else { ?>
+<?php } else { $date_format = "m.d."; ?>
 <a href="index.php?route=stat/stat&amp;timespan=daily<?php if(isset($uid)) { ?>&amp;uid=<?php print $uid; } ?>"><?php print $text_daily_report; ?></a> <strong><?php print $text_monthly_report; ?></strong>
 <?php } ?>
 
 </p>
 
-<p><img src="index.php?route=stat/graph&amp;timespan=<?php print $timespan; ?>&amp;uid=<?php print $uid; ?>" border="1" /> </p>
 
+<div>
+  <canvas id="myChart"></canvas>
+</div>
+
+<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
+
+<script>
+  const labels = [
+<?php foreach(array_keys($data) as $d) { print "'" . date($date_format, $d) . "',"; } ?>
+  ];
+
+  const data = {
+    labels: labels,
+    datasets: [{
+      label: '<?php print $text_archived_messages; ?>',
+      backgroundColor: 'rgb(255, 99, 132)',
+      borderColor: 'rgb(255, 99, 132)',
+      data: [
+<?php foreach(array_values($data) as $d) { print "'" . $d . "',"; } ?>
+      ],
+    }]
+  };
+
+  const config = {
+    type: 'line',
+    data: data,
+    options: {}
+  };
+
+  const chart = new Chart(document.getElementById('myChart'), config);
+</script>