Page Web

Dependencies:   mbed Serveur_web_capteur EthernetNetIf

Revision:
6:df1059a12a34
Parent:
5:976ba14cbadc
--- a/index.htm	Tue Jul 03 13:37:51 2018 +0000
+++ /dev/null	Thu Jan 01 00:00:00 1970 +0000
@@ -1,183 +0,0 @@
-Texte a recopier sur sublimetext il y'aura plus de problèmes de commentaires.
-
-<!DOCTYPE html>
-<html>
-<head>
-    <title>VentiBed</title>
-    <meta charset="UTF-8"> 
-    <!--> style CSS définie pour la beauté du site est pour décider de l'emplacement du tableau et des boutons  <-->
-    <style>
-body {                                                                          
-    background-color: #0000FF;
-}
-table, th, td {
-    border: 1px solid white;
-    border-collapse: collapse;
-    border-color: white ;
-    margin: auto;
-}
-th, td {
-    padding: 5px;
-    text-align: left;    
-}
-</style>
-</head>
-
-</style>
-<!--> le body c'est le corps du programme comme un main dans un programme en C la on définie 2 checkbox ave un id auto et un manu et enfin 2 boutons un avec in venti et l'autre rafraichir 
-puis nous déclarons un tableau avec 6 céllules <-->
-<body text="#FDF5E6">
-    <h1 style="text-align:center; color:white">VentiBed </h1>
-    <p><input type="checkbox" name="auto" id="auto"
-                                  onclick="auto_click()" />Auto</p>
-    <p><input type="checkbox" name="manu" id="manu"
-                                  onclick="manu_click()" />Manuel</p>
-    <p style="text-align:center;"><input type="button" id="venti" value="Activer Ventilateur">
-    </p>
-    <p id="temp"></p>
-    <p style="text-align:center;"><input id="rafraichir" type="button" value="Rafraichir">
-<table id="tableau" style="width:75%">
-  <tr>
-    <th rowspan="5">Temperature(°C)</th>
-    <td id="cell1"></td>
-  </tr>
-  <tr>
-    <td id="cell2"></td>
-  </tr>
-  <tr>
-    <td id="cell3"></td>
-  </tr>
-  <tr>
-    <td id="cell4"></td>
-  </tr>
-  <tr>
-    <td id="cell5"></td>
-  </tr>
- <tr>
-    <th>Moyenne</th>
-    <td id="cell6"></td>
-  </tr>
-</table>
-</body>
-</html>
-<!--> On rentre dans le script en javascript du site <-->
-<script type="text/javascript">
-
-var btn = document.querySelector('#venti');
-var btn2 = document.querySelector('#rafraichir');
-var checkauto = document.querySelector('#auto');
-var checkmanu = document.querySelector('#manu');
-var req=new XMLHttpRequest();
-var req2= new XMLHttpRequest();
-var data_recu=0;                            // Déclarations de toutes les variables nécéssaires déclarations des variables en variables globales 
-var temperature;    
-var temp;
-var tension;
-var etatauto;
-var tabtemperature;
-var min;
-var max;
-var tableau;
-var tab = [];
-var i=0;
-var stop;
-
-btn2.addEventListener('click', updateBtn2);      //2 évenement pour les boutons qui permert d'appler la fonction updatebtn2 ou 
-btn.addEventListener('click', updateBtn);       //updatebtn si on click sur l'un des boutons
-
-function updateBtn2() {
-    fcttableau();                       // si on appuye sur le btn2 qui est le bouton rafraichir on appel la fonctions fcttableau.
-    tab=[];
-}
-
-function lecture (){  
-    req.open('GET', '/rpc/capteur_temp/read', true);                                        // Fonction lecture qui permet de lire la température avec la  
-    req.onreadystatechange = function() {                                                  // meme méthode que du test n°2
-        if(req.readyState == 4 && req.status == 200) {
-            data_recu = req.responseText;
-            temp= document.getElementById("temp");
-            tension=data_recu*3.3;                                                          // je récupère une valeur analogique entre 0 et 1 donc
-            temperature = Math.round((30.7*tension-24.06)+2.6);                             // je l'a met en forme pour que la valeur analogique soit égale a la
-            temp.innerHTML ='La temperature est de : ' + temperature + ' °C.';              // Température
-
-        }
-    }
-    req.send(null);
-        if(document.getElementById('auto').checked){                                        // si le mode auto est check on regarde que la température ne
-            if(temperature>33){
-                        val='0';                                                            // dépasse pas les 33°C . si ça dépasse le ventilateur s'active
-                        req2.open('GET', '/rpc/venti/write '+val, true);                    // en mettant la commande a 0.
-                        req2.send(null);    
-                }else{
-                        val='1';
-                        req2.open('GET', '/rpc/venti/write '+val, true);                    // si la température est < 33°C le ventillateur ne s'active pas.
-                        req2.send(null);
-                }
-        }
-        if(i>=5){
-            stop=1;
-            btn2.disabled=false;                                                        // ce if permet de gerer le remplissage du tableau est de rafraichir les
-            i=0;                                                                        //valeurs du tableau quand le bouton rafraichir est activé.
-        }else{
-            tabtemperature=temperature;
-            tab.push(tabtemperature);
-            i++;
-            btn2.disabled=true;
-            stop=0;
-        }
-
- }
- function fcttableau (){
-
-            tableau= document.getElementById("cell1");                              // utilisation de la méthode innerhtml qui permet de remplir les cases du 
-            tableau.innerHTML = tab[0] ;                                            // tableau une par une avec les donnés récoltés
-            tableau= document.getElementById("cell2");                              // la méthode inner sert a écrire sur la page web ce qu'on a stocké.
-            tableau.innerHTML = tab[1] ;
-            tableau= document.getElementById("cell3");
-            tableau.innerHTML = tab[2] ;
-            tableau= document.getElementById("cell4");
-            tableau.innerHTML = tab[3] ;
-            tableau= document.getElementById("cell5");
-            tableau.innerHTML = tab[4] ;
-            tableau= document.getElementById("cell6");
-            tableau.innerHTML = (tab[0] + tab[1]+ tab[2]+ tab[3]+ tab[4])/5 ;
-            
-
-}
-function updateBtn() {
-  if (btn.value === 'Activer Ventilateur') {                        // la même structure que sur le test n°2 avec les boutons
-    btn.value = 'Desactiver Ventilateur';                           // mais la c'est l'utilisation du mode manuel.
-    val='0';
-    req.open('GET', '/rpc/venti/write '+val, true);
-    req.send(null);
-    
-  } else {
-    btn.value = 'Activer Ventilateur';
-    val='1';
-    req.open('GET', '/rpc/venti/write '+val, true);
-    req.send(null);
-  }
-}
-function manu_click(){
-    if (document.getElementById('manu').checked){                // permet d'activer le bouton "activer le ventillateur" ou le désactiver
-        btn.disabled = false;                                   // en foncton de la checkbox manuel si elle est cocher ou non
-        checkauto.disabled = true;
-    } else{
-        btn.disabled = true;
-        checkauto.disabled = false;
-    }
-}
-function auto_click(){
-    if (document.getElementById('auto').checked){           //  permet de desactiver tout les boutons si c'est en mode automatique
-        btn.disabled = true;                                //  en focntion de la checkbox automatique si elle est cocher ou non
-        checkmanu.disabled = true;
-        etatauto=1;
-        } else{
-        etatauto=0;
-        btn.disabled = true;
-        checkmanu.disabled = false;
-    }
-}
- setInterval(lecture,1000);                                 // appel de la fonction lecture toutes les 1sec.
-</script>
-