init
This commit is contained in:
parent
9813508a29
commit
1e148177a9
6
.gitignore
vendored
6
.gitignore
vendored
|
@ -14,3 +14,9 @@
|
||||||
.phpunit.result.cache
|
.phpunit.result.cache
|
||||||
/phpunit.xml
|
/phpunit.xml
|
||||||
###< symfony/phpunit-bridge ###
|
###< symfony/phpunit-bridge ###
|
||||||
|
|
||||||
|
###> symfony/web-server-bundle ###
|
||||||
|
/.web-server-pid
|
||||||
|
###< symfony/web-server-bundle ###
|
||||||
|
|
||||||
|
/node_modules
|
||||||
|
|
|
@ -25,6 +25,7 @@
|
||||||
"symfony/twig-pack": "*",
|
"symfony/twig-pack": "*",
|
||||||
"symfony/validator": "4.4.*",
|
"symfony/validator": "4.4.*",
|
||||||
"symfony/web-link": "4.4.*",
|
"symfony/web-link": "4.4.*",
|
||||||
|
"symfony/web-server-bundle": "4.4.*",
|
||||||
"symfony/yaml": "4.4.*"
|
"symfony/yaml": "4.4.*"
|
||||||
},
|
},
|
||||||
"require-dev": {
|
"require-dev": {
|
||||||
|
|
|
@ -12,4 +12,5 @@ return [
|
||||||
Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true],
|
Symfony\Bundle\MonologBundle\MonologBundle::class => ['all' => true],
|
||||||
Symfony\Bundle\DebugBundle\DebugBundle::class => ['dev' => true, 'test' => true],
|
Symfony\Bundle\DebugBundle\DebugBundle::class => ['dev' => true, 'test' => true],
|
||||||
Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true],
|
Symfony\Bundle\MakerBundle\MakerBundle::class => ['dev' => true],
|
||||||
|
Symfony\Bundle\WebServerBundle\WebServerBundle::class => ['dev' => true],
|
||||||
];
|
];
|
||||||
|
|
6
package.json
Normal file
6
package.json
Normal file
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"dependencies": {
|
||||||
|
"bulma": "^0.8.0",
|
||||||
|
"chart.js": "^2.9.3"
|
||||||
|
}
|
||||||
|
}
|
4
public/assets/css/app.css
Normal file
4
public/assets/css/app.css
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
.chart-container {
|
||||||
|
width: 100%;
|
||||||
|
height: 30vh;
|
||||||
|
}
|
62
public/assets/js/app.js
Normal file
62
public/assets/js/app.js
Normal file
|
@ -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)
|
1
public/node_modules
Symbolic link
1
public/node_modules
Symbolic link
|
@ -0,0 +1 @@
|
||||||
|
../node_modules
|
122
src/Controller/MonitoringApiController.php
Normal file
122
src/Controller/MonitoringApiController.php
Normal file
|
@ -0,0 +1,122 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Controller;
|
||||||
|
|
||||||
|
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
|
||||||
|
use Symfony\Component\Routing\Annotation\Route;
|
||||||
|
use Symfony\Component\HttpFoundation\JsonResponse;
|
||||||
|
use Symfony\Component\HttpFoundation\Request;
|
||||||
|
|
||||||
|
class MonitoringApiController extends AbstractController
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* @Route("/api/temperature", name="api_temperature")
|
||||||
|
*/
|
||||||
|
public function temperature(Request $request)
|
||||||
|
{
|
||||||
|
if ($request->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);
|
||||||
|
}
|
||||||
|
}
|
17
src/Controller/MonitoringController.php
Normal file
17
src/Controller/MonitoringController.php
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
namespace App\Controller;
|
||||||
|
|
||||||
|
use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
|
||||||
|
use Symfony\Component\Routing\Annotation\Route;
|
||||||
|
|
||||||
|
class MonitoringController extends AbstractController
|
||||||
|
{
|
||||||
|
/**
|
||||||
|
* @Route("/", name="index")
|
||||||
|
*/
|
||||||
|
public function index()
|
||||||
|
{
|
||||||
|
return $this->render('monitoring.html.twig');
|
||||||
|
}
|
||||||
|
}
|
11
symfony.lock
11
symfony.lock
|
@ -106,7 +106,7 @@
|
||||||
"version": "2.1.1"
|
"version": "2.1.1"
|
||||||
},
|
},
|
||||||
"php": {
|
"php": {
|
||||||
"version": "7.1"
|
"version": "7.4"
|
||||||
},
|
},
|
||||||
"phpdocumentor/reflection-common": {
|
"phpdocumentor/reflection-common": {
|
||||||
"version": "2.0.0"
|
"version": "2.0.0"
|
||||||
|
@ -487,6 +487,15 @@
|
||||||
"config/routes/dev/web_profiler.yaml"
|
"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": {
|
"symfony/yaml": {
|
||||||
"version": "v4.4.5"
|
"version": "v4.4.5"
|
||||||
},
|
},
|
||||||
|
|
|
@ -2,11 +2,47 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>{% block title %}Welcome!{% endblock %}</title>
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
{% block stylesheets %}{% endblock %}
|
<title>{% block title %}Terrarium{% endblock %}</title>
|
||||||
|
{% block css %}
|
||||||
|
<link rel="stylesheet" href="{{ asset('node_modules/bulma/css/bulma.min.css') }}">
|
||||||
|
<link rel="stylesheet" href="{{ asset('node_modules/chart.js/dist/Chart.min.css') }}">
|
||||||
|
<link rel="stylesheet" href="{{ asset('assets/css/app.css') }}">
|
||||||
|
{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% block body %}{% endblock %}
|
<nav class="navbar" role="navigation" aria-label="main navigation">
|
||||||
{% block javascripts %}{% endblock %}
|
<div class="navbar-brand">
|
||||||
|
<a class="navbar-item" href="https://bulma.io">
|
||||||
|
<img src="https://bulma.io/images/bulma-logo.png" width="112" height="28">
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
<span aria-hidden="true"></span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="navbarBasicExample" class="navbar-menu">
|
||||||
|
<div class="navbar-start">
|
||||||
|
<a class="navbar-item">
|
||||||
|
Monitoring
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a class="navbar-item">
|
||||||
|
Caméra
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
{% block body %}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block js %}
|
||||||
|
<script src="{{ asset('node_modules/chart.js/dist/Chart.bundle.min.js') }}"></script>
|
||||||
|
<script src="{{ asset('assets/js/app.js') }}"></script>
|
||||||
|
{% endblock %}
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
23
templates/monitoring.html.twig
Normal file
23
templates/monitoring.html.twig
Normal file
|
@ -0,0 +1,23 @@
|
||||||
|
{% extends 'base.html.twig' %}
|
||||||
|
|
||||||
|
{% block title %}{{ parent() }} - Moniteur{% endblock %}
|
||||||
|
|
||||||
|
{% block body %}
|
||||||
|
<section class="section">
|
||||||
|
<div class="title is-4">Température</div>
|
||||||
|
|
||||||
|
<div class="box">
|
||||||
|
<div class="chart-container" data-api="{{ path('api_temperature') }}" data-type="line">
|
||||||
|
<canvas class="chart-canvas" id="chart-temperature"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="title is-4">Hydrométrie</div>
|
||||||
|
|
||||||
|
<div class="box">
|
||||||
|
<div class="chart-container" data-api="{{ path('api_hydrometal') }}" data-type="line">
|
||||||
|
<canvas class="chart-canvas" id="chart-hydrometal"></canvas>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{% endblock %}
|
53
yarn.lock
Normal file
53
yarn.lock
Normal file
|
@ -0,0 +1,53 @@
|
||||||
|
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
|
||||||
|
# yarn lockfile v1
|
||||||
|
|
||||||
|
|
||||||
|
bulma@^0.8.0:
|
||||||
|
version "0.8.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/bulma/-/bulma-0.8.0.tgz#ac1606431703a4761b18a4a2d5cc1fa864a2aece"
|
||||||
|
integrity sha512-nhf3rGyiZh/VM7FrSJ/5KeLlfaFkXz0nYcXriynfPH4vVpnxnqyEwaNGdNCVzHyyCA3cHgkQAMpdF/SFbFGZfA==
|
||||||
|
|
||||||
|
chart.js@^2.9.3:
|
||||||
|
version "2.9.3"
|
||||||
|
resolved "https://registry.yarnpkg.com/chart.js/-/chart.js-2.9.3.tgz#ae3884114dafd381bc600f5b35a189138aac1ef7"
|
||||||
|
integrity sha512-+2jlOobSk52c1VU6fzkh3UwqHMdSlgH1xFv9FKMqHiNCpXsGPQa/+81AFa+i3jZ253Mq9aAycPwDjnn1XbRNNw==
|
||||||
|
dependencies:
|
||||||
|
chartjs-color "^2.1.0"
|
||||||
|
moment "^2.10.2"
|
||||||
|
|
||||||
|
chartjs-color-string@^0.6.0:
|
||||||
|
version "0.6.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/chartjs-color-string/-/chartjs-color-string-0.6.0.tgz#1df096621c0e70720a64f4135ea171d051402f71"
|
||||||
|
integrity sha512-TIB5OKn1hPJvO7JcteW4WY/63v6KwEdt6udfnDE9iCAZgy+V4SrbSxoIbTw/xkUIapjEI4ExGtD0+6D3KyFd7A==
|
||||||
|
dependencies:
|
||||||
|
color-name "^1.0.0"
|
||||||
|
|
||||||
|
chartjs-color@^2.1.0:
|
||||||
|
version "2.4.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/chartjs-color/-/chartjs-color-2.4.1.tgz#6118bba202fe1ea79dd7f7c0f9da93467296c3b0"
|
||||||
|
integrity sha512-haqOg1+Yebys/Ts/9bLo/BqUcONQOdr/hoEr2LLTRl6C5LXctUdHxsCYfvQVg5JIxITrfCNUDr4ntqmQk9+/0w==
|
||||||
|
dependencies:
|
||||||
|
chartjs-color-string "^0.6.0"
|
||||||
|
color-convert "^1.9.3"
|
||||||
|
|
||||||
|
color-convert@^1.9.3:
|
||||||
|
version "1.9.3"
|
||||||
|
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
|
||||||
|
integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
|
||||||
|
dependencies:
|
||||||
|
color-name "1.1.3"
|
||||||
|
|
||||||
|
color-name@1.1.3:
|
||||||
|
version "1.1.3"
|
||||||
|
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
|
||||||
|
integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
|
||||||
|
|
||||||
|
color-name@^1.0.0:
|
||||||
|
version "1.1.4"
|
||||||
|
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
|
||||||
|
integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
|
||||||
|
|
||||||
|
moment@^2.10.2:
|
||||||
|
version "2.24.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/moment/-/moment-2.24.0.tgz#0d055d53f5052aa653c9f6eb68bb5d12bf5c2b5b"
|
||||||
|
integrity sha512-bV7f+6l2QigeBBZSM/6yTNq4P2fNpSWj/0e7jQcy87A8e7o2nAfP/34/2ky5Vw4B9S446EtIhodAzkFCcR4dQg==
|
Loading…
Reference in a new issue