From ef01072944dac9ec234836e5258fe9fe9484b8b6 Mon Sep 17 00:00:00 2001
From: Sami Mokaddem <mokaddem.sami@gmail.com>
Date: Mon, 23 Oct 2017 15:32:44 +0200
Subject: [PATCH] Moved const var to config + linechart shift to hours (and
 current values)

---
 config.cfg                         |  6 +++++-
 server.py                          |  5 ++++-
 static/js/index/index.js           | 24 ++++++++++++++++++++++--
 static/js/index/index_lineChart.js | 20 ++++++++++++++++----
 static/js/index/index_map.js       |  4 ++--
 templates/index.html               | 12 ++++++++----
 6 files changed, 57 insertions(+), 14 deletions(-)

diff --git a/config.cfg b/config.cfg
index 1375df8..270b315 100644
--- a/config.cfg
+++ b/config.cfg
@@ -1,6 +1,10 @@
 [Dashboard]
-#seconde
+#hours
 graph_log_refresh_rate = 1
+#sec
+rotation_wait_time = 30
+max_img_rotation = 10
+hours_spanned = 48
 
 [Log]
 fieldname_order=["time", "id", "category", "type", "value"]
diff --git a/server.py b/server.py
index e22c798..0716029 100755
--- a/server.py
+++ b/server.py
@@ -82,7 +82,10 @@ class EventMessage():
 @app.route("/")
 def index():
     return render_template('index.html', 
-            graph_log_refresh_rate=cfg.getint('Dashboard' ,'graph_log_refresh_rate')
+            graph_log_refresh_rate=cfg.getint('Dashboard' ,'graph_log_refresh_rate'),
+            rotation_wait_time=cfg.getint('Dashboard' ,'rotation_wait_time'),
+            max_img_rotation=cfg.getint('Dashboard' ,'max_img_rotation'),
+            hours_spanned=cfg.getint('Dashboard' ,'hours_spanned')
             )
 
 @app.route("/_logs")
diff --git a/static/js/index/index.js b/static/js/index/index.js
index 4607d85..3249d70 100644
--- a/static/js/index/index.js
+++ b/static/js/index/index.js
@@ -1,4 +1,4 @@
-var maxNumPoint = 60;
+var maxNumPoint = hours_spanned;
 var emptyArray = [];
 for(i=0; i<maxNumPoint; i++) {
     emptyArray.push([i, 0]);
@@ -53,9 +53,29 @@ class Sources {
     toArray() {
         var to_return = [];
         for (var src of this._sourceNames) {
+            if(src == 'global') //ignore global
+                continue;
+            var realData = this._sourcesArray[src].slice(0); //clone array
+            realData.push([maxNumPoint, 0]);
             to_return.push({
                 label: src,
-                data: this._sourcesArray[src]
+                data: realData
+            });
+        }
+        return to_return;
+    }
+
+    toArrayDirect() {
+        var to_return = [];
+        for (var src of this._sourceNames) {
+            if(src == 'global') //ignore global
+                continue;
+            var realData = this._sourcesArray[src].slice(0); //clone array
+            realData.push([maxNumPoint, this._sourcesCount[src]]);
+            this._globalMax = this._globalMax > this._sourcesCount[src] ? this._globalMax : this._sourcesCount[src];
+            to_return.push({
+                label: src,
+                data: realData
             });
         }
         return to_return;
diff --git a/static/js/index/index_lineChart.js b/static/js/index/index_lineChart.js
index c759509..8b8ed84 100644
--- a/static/js/index/index_lineChart.js
+++ b/static/js/index/index_lineChart.js
@@ -1,5 +1,6 @@
-var updateInterval = 1000*graph_log_refresh_rate; // 1s
-var maxNumPoint = 60;
+var updateIntervalDirect = 1000*2; // 2s
+var updateInterval = 1000*60*60*graph_log_refresh_rate; // 1h
+var maxNumPoint = hours_spanned+1;
 
 var optionsLineChart = {
     series: {
@@ -13,8 +14,8 @@ var optionsLineChart = {
             },
     //colors: ["#2fa1db"],
     yaxis: { min: 0, max: 20 },
-    xaxis: { min: 0, max: maxNumPoint-1 },
-    ticks: maxNumPoint,
+    xaxis: { min: 0, max: maxNumPoint },
+    ticks: maxNumPoint+1,
     grid: {
         tickColor: "#dddddd",
         borderWidth: 0 
@@ -42,3 +43,14 @@ function updateChart() {
     setTimeout(updateChart, updateInterval);
 }
 updateChart()
+
+function updateChartDirect() {
+    console.log(sources.toArrayDirect());
+    plotLineChart.setData(sources.toArrayDirect());
+    plotLineChart.getOptions().yaxes[0].max = sources.getGlobalMax();
+    plotLineChart.setupGrid();
+    plotLineChart.draw();
+    setTimeout(updateChartDirect, updateIntervalDirect);
+}
+updateChartDirect()
+
diff --git a/static/js/index/index_map.js b/static/js/index/index_map.js
index ac7c504..764d4bd 100644
--- a/static/js/index/index_map.js
+++ b/static/js/index/index_map.js
@@ -1,7 +1,7 @@
 const MAXNUMCOORD = 100;
-const MAXIMGROTATION = 10;
-const ROTATIONWAITTIME = 1000*20; //30s
 const PINGWAITTIME = 1000*1; //1s
+const MAXIMGROTATION = max_img_rotation;
+const ROTATIONWAITTIME = 1000*rotation_wait_time; //seconds
 
 const OSMURL='http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
 const OSMATTRIB='Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors';
diff --git a/templates/index.html b/templates/index.html
index 067100c..9d47b44 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -112,7 +112,7 @@ small {
                         <!-- /.panel -->
                         <div class="panel panel-default" style="margin-top: 15px; height: 20vh;">
                             <div class="panel-heading">
-                                <i class="fa fa-bar-chart-o fa-fw"></i> Log feed
+                                <i class="fa fa-bar-chart-o fa-fw"></i> Log feed (hours)
                             </div>
                             <div id="panelbody" class="panel-body" style="width:100%; height: calc(100% - 30px);">
                                 <div id="feedDiv3" style="width:100%; height: calc(100% - 30px); position: relative;"></div>
@@ -197,10 +197,14 @@ small {
         var urlForHead = "{{ url_for('getLogHead') }}";
         var urlForMaps = "{{ url_for('maps') }}";
         var linkForDefaultMap = "{{ url_for('static', filename='maps/default.png') }}";
-        /* DATA */
+
+        /* DATA FROM CONF */
         var graph_log_refresh_rate = {{ graph_log_refresh_rate }};
-        setTimeout(function(){
-        }, 3000);
+        var rotation_wait_time = {{ rotation_wait_time }};
+        var max_img_rotation = {{ max_img_rotation }};
+        var hours_spanned = {{ hours_spanned }};
+
+
     </script>
     <script src="{{ url_for('static', filename='js/index/index.js') }}"></script>
     <script src="{{ url_for('static', filename='js/index/index_lineChart.js') }}"></script>