diff --git a/.gitignore b/.gitignore index eaa3cd3..813157f 100644 --- a/.gitignore +++ b/.gitignore @@ -14,3 +14,9 @@ .phpunit.result.cache /phpunit.xml ###< symfony/phpunit-bridge ### + +###> symfony/web-server-bundle ### +/.web-server-pid +###< symfony/web-server-bundle ### + +/node_modules diff --git a/composer.json b/composer.json index ba5c644..7b6c872 100644 --- a/composer.json +++ b/composer.json @@ -25,6 +25,7 @@ "symfony/twig-pack": "*", "symfony/validator": "4.4.*", "symfony/web-link": "4.4.*", + "symfony/web-server-bundle": "4.4.*", "symfony/yaml": "4.4.*" }, "require-dev": { diff --git a/config/bundles.php b/config/bundles.php index 7745edb..1a40026 100644 --- a/config/bundles.php +++ b/config/bundles.php @@ -12,4 +12,5 @@ return [ Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true], Symfony\Bundle\DebugBundle\DebugBundle::class => ['dev' => true, 'test' => true], Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true], + Symfony\Bundle\WebServerBundle\WebServerBundle::class => ['dev' => true], ]; diff --git a/package.json b/package.json new file mode 100644 index 0000000..721fef4 --- /dev/null +++ b/package.json @@ -0,0 +1,6 @@ +{ + "dependencies": { + "bulma": "^0.8.0", + "chart.js": "^2.9.3" + } +} diff --git a/public/assets/css/app.css b/public/assets/css/app.css new file mode 100644 index 0000000..755e0f8 --- /dev/null +++ b/public/assets/css/app.css @@ -0,0 +1,4 @@ +.chart-container { + width: 100%; + height: 30vh; +} diff --git a/public/assets/js/app.js b/public/assets/js/app.js new file mode 100644 index 0000000..29f1484 --- /dev/null +++ b/public/assets/js/app.js @@ -0,0 +1,62 @@ +var forEach = function (array, callback, scope) { + for (var i = 0; i < array.length; i++) { + callback.call(scope, i, array[i]); + } +}; + +window.chartColors = { + red: 'rgb(255, 99, 132)', + orange: 'rgb(255, 159, 64)', + yellow: 'rgb(255, 205, 86)', + green: 'rgb(75, 192, 192)', + blue: 'rgb(54, 162, 235)', + purple: 'rgb(153, 102, 255)', + grey: 'rgb(201, 203, 207)' +}; + +var ChartLoader = function() { + var charts = document.querySelectorAll('.chart-container'); + + forEach(charts, function(i, chart) { + var api = chart.getAttribute('data-api'); + var canvas = chart.querySelector('.chart-canvas'); + var height = chart.getAttribute('data-height'); + var data = {}; + var config = { + type: chart.getAttribute('data-type'), + data: data, + options: {} + }; + var instance = new Chart(canvas, config); + + chart.addEventListener('refresh', function() { + fetch(api) + .then(function(response) { + if(response.ok) { + response.json().then(function(json) { + if (json.hasOwnProperty('data')) { + instance.data = json.data; + } + + if (json.hasOwnProperty('options')) { + instance.options = json.options; + } + + if (json.hasOwnProperty('type')) { + instance.type = json.type; + } + + instance.update(); + instance.resize(); + }); + } + }); + }); + + chart.dispatchEvent(new Event('refresh')); + }); +} + +window.addEventListener('load', function() { + ChartLoader(); +}, false) diff --git a/public/node_modules b/public/node_modules new file mode 120000 index 0000000..68a084a --- /dev/null +++ b/public/node_modules @@ -0,0 +1 @@ +../node_modules \ No newline at end of file diff --git a/src/Controller/MonitoringApiController.php b/src/Controller/MonitoringApiController.php new file mode 100644 index 0000000..2cdcb1a --- /dev/null +++ b/src/Controller/MonitoringApiController.php @@ -0,0 +1,122 @@ +isMethod('POST')) { + } else { + $labels = []; + $datasets = []; + + $dateFrom = time() - 3600 * 24; + $dateTo = time(); + + $line = [ + 'label' => 'En degré celsius', + 'data' => [], + 'borderColor' => 'rgb(255, 205, 86)', + 'backgroundColor' => 'rgb(255, 205, 86)', + 'fill' => false, + ]; + + $line2 = [ + 'label' => 'Valeur idéale', + 'data' => [], + 'borderColor' => 'rgb(200, 200, 200)', + 'backgroundColor' => 'rgb(200, 200, 200)', + 'fill' => false, + ]; + + for ($u = $dateFrom; $u <= $dateTo; $u+= 600) { + $labels[] = date('H:i', $u); + $line['data'][] = mt_rand(22, 24); + $line2['data'][] = 23; + } + + $datasets[] = $line; + $datasets[] = $line2; + + return $this->createGraphResponse($labels, $datasets); + } + } + + /** + * @Route("/api/hydrometal", name="api_hydrometal") + */ + public function hydrometal(Request $request) + { + if ($request->isMethod('POST')) { + } else { + $labels = []; + $datasets = []; + + $dateFrom = time() - 3600 * 24; + $dateTo = time(); + + $line = [ + 'label' => 'Niveau d\'humidité en %', + 'data' => [], + 'borderColor' => 'rgb(54, 162, 235)', + 'backgroundColor' => 'rgb(54, 162, 235)', + 'fill' => false, + ]; + + $line2 = [ + 'label' => 'Valeur idéale', + 'data' => [], + 'borderColor' => 'rgb(200, 200, 200)', + 'backgroundColor' => 'rgb(200, 200, 200)', + 'fill' => false, + ]; + + for ($u = $dateFrom; $u <= $dateTo; $u+= 600) { + $labels[] = date('H:i', $u); + $line['data'][] = mt_rand(50, 55); + $line2['data'][] = 53; + } + + $datasets[] = $line; + $datasets[] = $line2; + + return $this->createGraphResponse($labels, $datasets); + } + } + + protected function createGraphResponse(array $labels, array $datasets): JsonResponse + { + $config = [ + 'data' => [ + 'labels' => $labels, + 'datasets' => $datasets, + ], + 'options' => [ + 'responsive' => false, + 'ratio' => 10, + 'maintainAspectRatio' => false, + 'legend' => [ + 'align' => 'end', + ], + 'scales' => [ + 'yAxes' => [[ + 'ticks' => [ + 'beginAtZero' => true, + ], + ]], + ], + ], + ]; + + return $this->json($config); + } +} diff --git a/src/Controller/MonitoringController.php b/src/Controller/MonitoringController.php new file mode 100644 index 0000000..b5db621 --- /dev/null +++ b/src/Controller/MonitoringController.php @@ -0,0 +1,17 @@ +render('monitoring.html.twig'); + } +} diff --git a/symfony.lock b/symfony.lock index 503f906..4f26ee9 100644 --- a/symfony.lock +++ b/symfony.lock @@ -106,7 +106,7 @@ "version": "2.1.1" }, "php": { - "version": "7.1" + "version": "7.4" }, "phpdocumentor/reflection-common": { "version": "2.0.0" @@ -487,6 +487,15 @@ "config/routes/dev/web_profiler.yaml" ] }, + "symfony/web-server-bundle": { + "version": "3.3", + "recipe": { + "repo": "github.com/symfony/recipes", + "branch": "master", + "version": "3.3", + "ref": "dae9b39fd6717970be7601101ce5aa960bf53d9a" + } + }, "symfony/yaml": { "version": "v4.4.5" }, diff --git a/templates/base.html.twig b/templates/base.html.twig index 043f42d..7f630a8 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -2,11 +2,47 @@
-