Skip to content
GitLab
Commit caba46ba authored by LockhomeDevelopper's avatar LockhomeDevelopper
Browse files

Up

parent adf4857f
Hide whitespace changes
Inline Side-by-side
application/controllers/Camera.php
View file @ caba46ba
......@@ -103,9 +103,10 @@ class Camera extends CI_Controller
/**Fonction qui permet de recuperer la liste des fichiers disponibles sur la camera*/
//Se connecter au JSON a l'adresse base_url("https://api.coingecko.com/api/v3/ping" -H "accept: application/json")
//puis le parser et faire un var-dump
$contenu = file_get_contents("https://api.coingecko.com/api/v3/ping");
var_dump($contenu);
echo "TEST";
$contenu = file_get_contents(base_url("camera/stream/$camera->ip/files"));
//convertir json en tableau en php puis passer ce tableau dans $data['files'] = $le tableau
$data['files'] = json_decode($contenu);
$this->load->view('camera/view', $data);
} else {
redirect("/camera", "refresh");
......
application/views/accueil/accueil.php
View file @ caba46ba
......@@ -28,53 +28,137 @@
</div>
</header>
<main>
<div class="container">
<section class="simple_layout">
<?php if($capteur_log == false) { ?>
<div class="container">
<!-- ------------------------------ TEST ------------------------------ -->
<div class="bloc white_b black">
<div class="container_bloc one_line_bloc l_r">
<div class="left">
<i class='uil uil-shield-check'></i>
<p>Aucune intrusion détectée</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</div>
</div>
<div class="green_intrusion l_r">
<div class="left">
<i class='uil uil-shield-check'></i>
<p>Aucune intrusion détectée</p>
<section class="bloc white_b black">
<div class="container_bloc severals_lines_bloc">
<div class="l_r">
<div class="title_bloc left blue">
<i class='uil uil-comment-info-alt'></i>
<p>Guide d'utilisation de cette page</p>
</div>
<div class="right"><i class='uil uil-angle-down'></i></div>
</div>
<div class="content_bloc">
<p>
Dans la première partie vous pourrez visualiser la dernière notification émise,
cette section est en vert si il n'y a pas de notification et en rouge si il y en a.
</p>
<p>
Dans le seconde partie vous pouvez choisir quel profil activer et voir la plage horaire
de ce profil.
</p>
<p>
La dernière partie est un menu afin d'accèder aux différentes partie du site.
</p>
<p>
Le premier bouton permet d'accèder aux profils afin de les gérers
</p>
<p>
Le deuxième bouton permet accèder aux notifications afin de les visualiser
et de les supprimer.
</p>
<p>
Le troisième bouton permet d'accèder aux capteurs afin de les gérers
</p>
<p>
Le premier bouton permet d'accèder aux caméras afin de les gérers.
</p>
<p>
Pour les profils, capteurs et caméras vous aurez la possibilité d'en ajouter, de modifier
les existants et d'en supprimer.
</p>
</div>
</div>
</section>
<?php } else { ?>
<div class="bloc white_b black">
<div class="container_bloc severals_lines_bloc l_r red_b white">
<div class="left title_bloc">
<i class='uil uil-shield-exclamation'></i>
<p>Une intrusion a été détectée</p>
</div>
<div class="left">
<p class="detailIntrusion">Intrusion le <?= date_format($capteur_log->date, "d/m/Y") ?> à <?= date_format($capteur_log->date, "H:i") ?>, détectée via le capteur "<?= $capteur_log->nom ?>".</p>
</div>
<div class="red_intrusion l_r">
<div class="left intrusion_detected in_red_intrusion">
<i class='uil uil-shield-exclamation'></i>
<p>Une intrusion a été détectée</p>
<a class="go_to_camera l_r" href="<?= base_url("/resume/show/".date("d/m/Y")) ?>">
<div class="left">
<i class='uil uil-clock'></i>
<p>Voir les évènements</p>
</div>
<div class="left in_red_intrusion">
<p class="detailIntrusion">Intrusion le <?= date_format($capteur_log->date, "d/m/Y") ?> à <?= date_format($capteur_log->date, "H:i") ?>, détectée via le capteur "<?= $capteur_log->nom ?>".</p>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a class="go_to_camera l_r in_red_intrusion" href="<?= base_url("/resume/show/".date("d/m/Y")) ?>">
<div class="left">
<i class='uil uil-clock'></i>
<p>Voir les évènements</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a class="go_to_camera l_r" href="<?= base_url("/camera") ?>">
<div class="left">
<i class='uil uil-camera'></i>
<p>Voir les caméras</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
</div>
<!-- ------------------------------ TEST ------------------------------ -->
<?php if($capteur_log == false) { ?>
<a class="go_to_camera l_r in_red_intrusion" href="<?= base_url("/camera") ?>">
<div class="left">
<i class='uil uil-camera'></i>
<p>Voir les caméras</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<div class="intrusion green_intrusion l_r">
<div class="left">
<i class='uil uil-shield-check'></i>
<p>Aucune intrusion détectée</p>
</div>
</div>
<?php } ?>
<?php } else { ?>
<div class="intrusion red_intrusion l_r">
<div class="left intrusion_detected">
<i class='uil uil-shield-exclamation'></i>
<p>Une intrusion a été détectée</p>
</div>
<div class="left">
<p class="detailIntrusion">Intrusion le <?= date_format($capteur_log->date, "d/m/Y") ?> à <?= date_format($capteur_log->date, "H:i") ?>, détectée via le capteur "<?= $capteur_log->nom ?>".</p>
</div>
<a class="go_to_camera l_r" href="<?= base_url("/resume/show/".date("d/m/Y")) ?>">
<div class="left">
<i class='uil uil-clock'></i>
<p>Voir les évènements</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a class="go_to_camera l_r" href="<?= base_url("/camera") ?>">
<div class="left">
<i class='uil uil-camera'></i>
<p>Voir les caméras</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
<?php } ?>
</section>
<section class="guide">
<div class="l_r">
<div class="left blue">
......@@ -156,47 +240,53 @@
<p><?=$profil_actif->debut ?> - <?=$profil_actif->fin ?></p>
</div>
</section>
</div>
<h6 class="big">Menu</h6>
<h6 class="big">Menu</h6>
<div class="container menu">
<a href="<?= base_url("/profil/list") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-label-alt'></i>
<div class="title">Gestion des profils</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a href="<?= base_url("/resume") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-clipboard-alt'></i>
<div class="title">Gestion des notifications</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a href="<?= base_url("/capteur/list") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-processor'></i>
<div class="title">Gestion des capteurs</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<a href="<?= base_url("/camera") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-camera'></i>
<div class="title">Gestion des caméras</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
<div>
<a href="<?= base_url("/profil/list") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-label-alt'></i>
<div class="title">Gestion des profils</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
<div>
<a href="<?= base_url("/resume") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-clipboard-alt'></i>
<div class="title">Gestion des notifications</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
<div>
<a href="<?= base_url("/capteur/list") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-processor'></i>
<div class="title">Gestion des capteurs</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
<div>
<a href="<?= base_url("/camera") ?>" class="simple_button_link l_r blue">
<div class="left">
<i class='uil uil-camera'></i>
<div class="title">Gestion des caméras</div>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</div>
</div>
</main>
</body>
......
application/views/camera/view.php
View file @ caba46ba
......@@ -52,22 +52,34 @@
<h6 class="big">Vidéos</h6>
<table>
<!-- Boucle qui va créer un nouveau tr ,je prends le titre + ajouter un lien qui permet de visualiser la video = base_url(/camera/stream/$ip/stream-file/letitre)
+ ajouter un bouton telechargement (trouver un icon : unicons) : lien vesr la page base_url("/camera/stream/$ip/download-file/letitre)
-->
<thead>
<td class="columnUn">Filmé le</td>
<td class="columnDeux">Durée</td>
<td class="columnTrois">Action</td>
</thead>
<tbody>
<?php
foreach($files as $item){
?>
<tr>
<td class="columnUn">16/12/2019 à 23h00</td>
<td class="columnDeux">15 min</td>
<td class="columnTrois"><i class='uil uil-play'></i></td>
</tr>
<tr>
<td class="columnUn">16/12/2019 à 19h00</td>
<td class="columnDeux">5 min</td>
<td class="columnTrois"><i class='uil uil-play'></i></td>
<td class="columnUn"><?php echo str_replace("_"," à ", str_replace(".mp4","", $item)); ?></td>
<td class="columnTrois">
<a href="<?= base_url("/camera/stream/$ip/stream-file/$item") ?>">
<i class='uil uil-play black'></i>
</a>
<a href="<?= base_url("/camera/stream/$ip/download-file/$item") ?>">
<i class='uil uil-cloud-download black'></i>
</a>
<a href="<?= base_url("/camera/stream/$ip/delete-file/$item") ?>">
<i class='uil uil-trash black'></i>
</a>
</td>
</tr>
<?php
}
?>
</tbody>
</table>
......
application/views/profil/edit.php
View file @ caba46ba
......@@ -6,11 +6,9 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Profil - LockHome</title>
<link rel="stylesheet" href="<?= base_url("/static/profil_edition.css") ?>">
<link rel="stylesheet" href="<?= base_url("/static/commun.css") ?>">
<link rel="stylesheet" href="<?= base_url("/static/style_general_commun.css") ?>">
<link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://unicons.iconscout.com/release/v2.0.1/css/unicons.css">
</head>
......
application/views/resume/list.php
View file @ caba46ba
......@@ -45,34 +45,33 @@
if(is_array($intrusion)){
foreach($intrusion as $date) { ?>
<section class="simple_layout red_intrusion">
<div class="l_r" style="width: 100%;">
<div class="left" style="flex-direction: column;">
<div class=" intrusion_detected">
<i class='uil uil-shield-exclamation'></i>
<p>Une intrusion a été détectée</p>
</div>
<div>
<p class="detailIntrusion">Une intrusion a été détecté à <?= date_format($date, "H:i") ?>.</p>
</div>
<div class="l_r" style="width: 100%;">
<div class="left" style="flex-direction: column;">
<div class=" intrusion_detected">
<i class='uil uil-shield-exclamation'></i>
<p>Une intrusion a été détectée</p>
</div>
<div class="detailIntrusion">
<p>Une intrusion a été détecté à <?= date_format($date, "H:i") ?>.</p>
</div>
<a style="color:white" href="<?= base_url("/resume/delete/" . date("Y-m-d")) ?>">
<div class="right">
<i class="uil uil-trash-alt"></i>
</div>
</a>
</div>
<a class="go_to_camera l_r" href="<?= base_url("/resume/show/".date("d/m/Y")) ?>">
<div class="left">
<i class='uil uil-clock'></i>
<p>Voir les évènements</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
<a style="color:white" class="poubelle_lien" href="<?= base_url("/resume/delete/" . date("Y-m-d")) ?>">
<div class="right poubelle">
<i class="uil uil-trash-alt"></i>
</div>
</a>
</div>
<a class="go_to_camera l_r" href="<?= base_url("/resume/show/".date("d/m/Y")) ?>">
<div class="left">
<i class='uil uil-clock'></i>
<p>Voir les évènements</p>
</div>
<div class="right">
<i class='uil uil-angle-right'></i>
</div>
</a>
</section>
<?php } } else { ?>
......
static/accueil.css
View file @ caba46ba
main .button,
main .guide,
main .maison,
main .simple_layout {
margin-top: 15px;
.intrusion{
color: white;
border-radius: 5px;
}
.red_intrusion {
flex-direction: column;
width: 100%;
border-radius: 5px;
background: #c62828;
}
.in_red_intrusion {
.green_intrusion {
flex-direction: row;
background: #27AE60;
}
.intrusion > * {
width: 100%;
}
.in_red_intrusion .uil-shield-exclamation {
.intrusion .uil-shield-exclamation {
font-size: 28px;
}
.green_intrusion {
padding: 15px 0px;
flex-direction: row;
width: 100%;
border-radius: 5px;
background: #27AE60;
.intrusion > div:nth-child(1){
margin: 15px 0px;
}
.intrusion_detected {
font-size: 19px;
display: flex;
align-items: center;
margin: 15px auto;
}
.detailIntrusion {
......@@ -41,7 +37,6 @@ main .simple_layout {
a.go_to_camera {
padding: 10px 0;
text-decoration: none;
background: rgba(255, 255, 255, 0.1);
transition: background .3s;
color: white;
......@@ -53,7 +48,6 @@ a.go_to_camera:hover {
.maison {
height: auto;
text-decoration: none;
background: #FFFFFF;
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
......@@ -90,8 +84,7 @@ a.go_to_camera:hover {
}
.maison .maison_profil,
.maison .maison_horaire,
.maison .maison_capteur {
.maison .maison_horaire{
padding: 15px 0 20px 15px;
font-size: 16px;
}
......@@ -101,37 +94,8 @@ a.go_to_camera:hover {
display: flex;
}
.maison .maison_detail_capteur {
display: flex;
margin-left: 20px;
}
.maison .maison_detail_capteur p {
margin: 0px;
}
.maison .maison_capteur .title,
.maison .maison_capteur .maison_detail_capteur {
margin-bottom: 10px;
}
.indicateur {
display: block;
width: 10px;
height: 10px;
border-radius: 100%;
margin: auto 10px auto 0;
}
/*************************************************************************/
@media only screen and (min-width: 1240px) {
.guide_et_maison {
display: flex;
justify-content: space-between;
}
.guide_et_maison section {
width: 49%;
}
.menu {
display: flex;
justify-content: space-between;
......
static/camera_view.css
View file @ caba46ba
......@@ -11,7 +11,7 @@ main table {
border-collapse: collapse;
overflow: hidden;
text-align: center;
width: 30%;
width: 100%;
margin: 0px auto 50px auto
}
......
static/commun.css
View file @ caba46ba
......@@ -38,11 +38,11 @@ Permet de disposer les éléments à gauche et à droite
justify-content: flex-end;
}
.l_r .left>* {
.l_r .left > * {
margin-left: 15px;
}
.l_r .right>* {
.l_r .right > * {
margin-right: 15px;
}
......@@ -71,7 +71,6 @@ Permet de faire un bloc sans lien
*/
section.simple_layout {
text-decoration: none;
font-weight: 400;
color: white;
/*background: #27AE60;*/
......@@ -79,7 +78,6 @@ section.simple_layout {
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
display: flex;
flex-shrink: 0;
}
......@@ -100,15 +98,11 @@ Permet de faire le cadre du bouton
a.simple_button_link {
height: 50px;
text-decoration: none;
font-weight: 400;
color: black;
background: white;
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
margin-bottom: 15px;
transition: box-shadow .3s, background .3s, color .3s;
flex-shrink: 0;
}
a.simple_button_link:hover {
......@@ -143,7 +137,6 @@ a.image_button_link {
margin-bottom: 15px;
height: auto;
width: 90%;
text-decoration: none;
background: #FFFFFF;
border-radius: 5px;
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.15);
......@@ -177,9 +170,7 @@ Permet de faire le cadre des inputs
*/
main label.input {
flex-shrink: 0;
height: 50px;
text-decoration: none;
font-weight: 400;
color: black;
background: white;
......@@ -215,7 +206,7 @@ main label.input input {
main .bottom {
position: absolute;
bottom: 0;
bottom: 15px;
width: 90%;
}
......@@ -345,7 +336,7 @@ Ajout des couleurs (utilisé pour nimporte quel composant)
main .red,
.red {
color: #E62929;
color: #c62828;
}
main .blue,
......@@ -369,11 +360,36 @@ main .orange,
}
main .white,
.orange {
.white {
color: white;
}
.red_b {
background-color: #c62828;
}
.blue_b {
background-color: #4C84FF;
}