Split all data and data from last week, moved chart to the right side of the page.

9 files changed, 236 insertions, 11 deletions

diff --git a/app/Resources/views/base.html.twig b/app/Resources/views/base.html.twig
index 3f93ff8..b4cc11a 100644
--- a/app/Resources/views/base.html.twig
+++ b/app/Resources/views/base.html.twig
@@ -14,8 +14,11 @@
                 <img src="https://cdn3.iconfinder.com/data/icons/christmas-icon-set-pixel-perfect/64/christmas-color-12-512.png" alt="Pollutometer" width="50px" height="auto">
                 <span>Pollutometer</span>
             </a>
-            <a class="navbar-item" href="/AllDataReadings">
-                <span>All Data Readings</span>
+            <a class="navbar-item" href="/{{ path('AllData') }}">
+                <span>All Data</span>
+            </a>
+            <a class="navbar-item" href="/{{ path('LastWeekData') }}">
+                <span>Last Week Data</span>
             </a>
         </div>
     </nav>
diff --git a/app/Resources/views/default/AllDataPage.html.twig b/app/Resources/views/default/AllData.html.twig
index 4607049..7bc33af 100644
--- a/app/Resources/views/default/AllDataPage.html.twig
+++ b/app/Resources/views/default/AllData.html.twig
@@ -1,6 +1,8 @@
 {% extends 'base.html.twig' %}
 
 {% block body %}
+<div class="columns">
+    <div class="column is-narrow">
 <table class="table">
     <thead class="thead">
         <tr class="tr">
@@ -21,9 +23,13 @@
     </tbody>
     {% endfor %}
 </table>
+    </div>
+    <div class="column">
 <canvas id="ctx"></canvas>
+    </div>
+</div>
 {% endblock %}
 {% block javascripts %}
     <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.min.js"></script>
-    <script src="{{ asset('js/chartOfReadings.js') }}"></script
+    <script src="{{ asset('js/AllDataChart.js') }}"></script
 {% endblock %}
\ No newline at end of file
diff --git a/app/Resources/views/default/LastWeekData.html.twig b/app/Resources/views/default/LastWeekData.html.twig
new file mode 100644
index 0000000..fdc6dd9
--- /dev/null
+++ b/app/Resources/views/default/LastWeekData.html.twig
@@ -0,0 +1,35 @@
+{% extends 'base.html.twig' %}
+
+{% block body %}
+<div class="columns">
+    <div class="column is-narrow">
+<table class="table">
+    <thead class="thead">
+        <tr class="tr">
+            <th>TimeStamp</th>
+            <th>Co</th>
+            <th>No</th>
+            <th>So</th>
+        </tr>
+    </thead>
+    <tbody class="tbody">
+        <tr class="tr">
+            {% for table in data %}
+            <td class="td">{{ table.TimeStamp }}</td>
+            <td class="td">{{ table.Co }}</td>
+            <td class="td">{{ table.No }}</td>
+            <td class="td">{{ table.So }}</td>
+        </tr>
+    </tbody>
+    {% endfor %}
+</table>
+    </div>
+    <div class="column">
+<canvas id="ctx"></canvas>
+    </div>
+</div>
+{% endblock %}
+{% block javascripts %}
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.1/Chart.bundle.min.js"></script>
+    <script src="{{ asset('js/LastWeekDataChart.js') }}"></script
+{% endblock %}
\ No newline at end of file
diff --git a/src/AppBundle/Controller/AllDataAverageController.php b/src/AppBundle/Controller/AllDataAverageController.php
new file mode 100644
index 0000000..439058a
--- /dev/null
+++ b/src/AppBundle/Controller/AllDataAverageController.php
@@ -0,0 +1,68 @@
+<?php
+namespace AppBundle\Controller;
+
+use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
+use Symfony\Component\HttpFoundation\Response;
+use Symfony\Bundle\FrameworkBundle\Controller\Controller;
+
+
+class AllDataAverageController extends Controller
+{
+    /**
+     * @Route("/AllDataAverage", name="AllDataAverage")
+     */
+
+    public function GetAllDataAverage()
+    {
+        // Get cURL resource
+        $curl = curl_init();
+        curl_setopt($curl, CURLOPT_URL, "https://pollutometerapi.azurewebsites.net/api/Readings");
+        curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-type: application/json')); // Assuming you're requesting JSON
+        curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
+        // Send the request & save response to $resp
+        $resp = curl_exec($curl);
+        // Close request to clear up some resources
+        curl_close($curl);
+
+        $data = json_decode($resp, true);
+
+        $readings = array();
+
+
+        foreach($data as $index => $item)
+        {
+            $data[$index]['TimeStamp'] = gmdate('d F l', $item['TimeStamp']);
+            $readings[$data[$index]['TimeStamp']][] = $data[$index];
+        }
+
+       $gasAverage = array('Co' => 0, 'No' => 0, 'So' => 0);
+        foreach($readings as $key => $item)
+        {
+            foreach($readings[$key] as $index => $values)
+            {
+
+                $gasAverage['Co'] += $readings[$key][$index]['Co'];
+                $gasAverage['No'] += $readings[$key][$index]['No'];
+                $gasAverage['So'] += $readings[$key][$index]['So'];
+
+                if($index === count($readings[$key]) - 1)
+                {
+                    $gasAverage['Co'] /= $index + 1;
+                    $gasAverage['No'] /= $index + 1;
+                    $gasAverage['So'] /= $index + 1;
+                }
+            }
+
+            $readings[$key] = $gasAverage;
+
+        }
+
+
+        $data = json_encode($readings);
+
+
+        $response = new Response($data);
+        $response->headers->set('Content-Type', 'application/json');
+        return $response;
+    }
+}
\ No newline at end of file
diff --git a/src/AppBundle/Controller/AllDataController.php b/src/AppBundle/Controller/AllDataController.php
index 86ec7c5..b45d2c9 100644
--- a/src/AppBundle/Controller/AllDataController.php
+++ b/src/AppBundle/Controller/AllDataController.php
@@ -2,21 +2,20 @@
 namespace AppBundle\Controller;
 
 use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
-use Symfony\Component\HttpFoundation\Response;
 use Symfony\Bundle\FrameworkBundle\Controller\Controller;
 
 
 class AllDataController extends Controller
 {
     /**
-     * @Route("/AllDataReadings", name="AllData")
+     * @Route("/AllData", name="AllData")
      */
 
     public function GetAllData()
     {
         // Get cURL resource
         $curl = curl_init();
-        curl_setopt($curl, CURLOPT_URL, "https://pollutometerapi.azurewebsites.net/api/Readings/lastweek");
+        curl_setopt($curl, CURLOPT_URL, "https://pollutometerapi.azurewebsites.net/api/Readings");
         curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-type: application/json')); // Assuming you're requesting JSON
         curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
         // Send the request & save response to $resp
@@ -38,7 +37,7 @@ class AllDataController extends Controller
 
         $parametersToTwig = array("data" => $data);
 
-        return $this->render('default/AllDataPage.html.twig',$parametersToTwig);
+        return $this->render('default/AllData.html.twig',$parametersToTwig);
 
     }
 }
\ No newline at end of file
diff --git a/src/AppBundle/Controller/LastWeekData.php b/src/AppBundle/Controller/LastWeekDataAverageController.php
index 24086c8..fe30fd4 100644
--- a/src/AppBundle/Controller/LastWeekData.php
+++ b/src/AppBundle/Controller/LastWeekDataAverageController.php
@@ -6,13 +6,13 @@ use Symfony\Component\HttpFoundation\Response;
 use Symfony\Bundle\FrameworkBundle\Controller\Controller;
 
 
-class LastWeekData extends Controller
+class LastWeekDataAverageController extends Controller
 {
     /**
-     * @Route("/lastweek", name="LastWeek")
+     * @Route("/LastWeekDataAverage", name="LastWeekDataAverage")
      */
 
-    public function GetLastWeekData()
+    public function GetLastWeekAverageData()
     {
         // Get cURL resource
         $curl = curl_init();
diff --git a/src/AppBundle/Controller/LastWeekDataController.php b/src/AppBundle/Controller/LastWeekDataController.php
new file mode 100644
index 0000000..f77a751
--- /dev/null
+++ b/src/AppBundle/Controller/LastWeekDataController.php
@@ -0,0 +1,43 @@
+<?php
+namespace AppBundle\Controller;
+
+use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
+use Symfony\Bundle\FrameworkBundle\Controller\Controller;
+
+
+class LastWeekDataController extends Controller
+{
+    /**
+     * @Route("/LastWeekData", name="LastWeekData")
+     */
+
+    public function GetAllData()
+    {
+        // Get cURL resource
+        $curl = curl_init();
+        curl_setopt($curl, CURLOPT_URL, "https://pollutometerapi.azurewebsites.net/api/Readings/lastweek");
+        curl_setopt($curl, CURLOPT_HTTPHEADER, array('Content-type: application/json')); // Assuming you're requesting JSON
+        curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
+        // Send the request & save response to $resp
+        $resp = curl_exec($curl);
+        // Close request to clear up some resources
+        curl_close($curl);
+
+        $data = json_decode($resp, true);
+
+
+        usort($data, function($a,$b){
+            return $a['TimeStamp'] - $b['TimeStamp'];
+        });
+
+        foreach($data as $index => $item)
+        {
+            $data[$index]['TimeStamp'] = gmdate("l jS \of F Y h:i:s A", $item['TimeStamp']);
+        }
+
+        $parametersToTwig = array("data" => $data);
+
+        return $this->render('default/LastWeekData.html.twig',$parametersToTwig);
+
+    }
+}
\ No newline at end of file
diff --git a/web/js/chartOfReadings.js b/web/js/AllDataChart.js
index 83f656a..8de05cf 100644
--- a/web/js/chartOfReadings.js
+++ b/web/js/AllDataChart.js
@@ -27,7 +27,7 @@ var datasets = [{
 
 
 
-fetch('/lastweek')
+fetch('/AllDataAverage')
     .then(function(response) {
         return response.json();
     })
diff --git a/web/js/LastWeekDataChart.js b/web/js/LastWeekDataChart.js
new file mode 100644
index 0000000..a24d51a
--- /dev/null
+++ b/web/js/LastWeekDataChart.js
@@ -0,0 +1,71 @@
+var gasReading = {
+    Co: [],
+    No: [],
+    So: []
+};
+
+var canvas = document.querySelector('#ctx');
+var ctx = canvas.getContext('2d');
+
+var datasets = [{
+    label: "Co",
+    borderColor: "rgb(5, 0, 0)",
+    fill: false,
+    data: []
+}, {
+    label: "No",
+    borderColor: "rgb(69, 169, 230)",
+    fill: false,
+    data: []
+}, {
+    label: "So",
+    borderColor: "rgb(246, 250, 15)",
+    fill: false,
+    data: []
+}]
+
+
+
+
+fetch('/LastWeekDataAverage')
+    .then(function(response) {
+        return response.json();
+    })
+    .then(function(data) {
+        drawChart(data, datasets);
+    })
+
+
+
+
+
+function drawChart(gasData, datasets) {
+
+    var finishedData = {
+        labels: []
+    }
+
+    Object.keys(gasData).forEach(function(key) {
+        finishedData.labels.push(key);
+        datasets[0].data.push(gasData[key].Co)
+        datasets[1].data.push(gasData[key].No);
+        datasets[2].data.push(gasData[key].So);
+    });
+
+    finishedData.datasets = datasets;
+
+
+    var myLineChart = new Chart(ctx, {
+        type: 'line',
+        data: finishedData,
+        options: {
+            scales: {
+                xAxes: [{
+                    time: {
+                        unit: 'day'
+                    }
+                }]
+            }
+        }
+    });
+}