Pages: [1]   Go Down
Author Topic: Modif variable avec bouton sur page HTML  (Read 1152 times)
0 Members and 1 Guest are viewing this topic.
Offline Offline
Newbie
*
Karma: 0
Posts: 43
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Bonjour,
dans ma page HTML je voudrai y inclure des boutons pour modifier quelques variables mais pas moyen d'y arriver.  smiley-cry

par exemple ce bouton doit lors du clic changer le booléen de false à true mais ça ne fonctionne pas.

Quote
boolean Auto= false;

 void AutoOff()
 {
    Auto= true;
 }
Merci d'avance.
client.print("<input type='button' value='Auto' onClick= AutoOff() />");


Logged

Débutant mais acharné!!

Ales
Offline Offline
Faraday Member
**
Karma: 29
Posts: 3176
Do or DIY
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Bin la on est pas près de t'aider : un bout de code très vague, aucun de la page html, aucune info sur le materiel, la connexion ...
Logged


Offline Offline
Newbie
*
Karma: 0
Posts: 43
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Ah ok, je pensé que la déclaration, la fonction et l'affichage suffisait, donc voila le scketch.
Code:
#include <SPI.h>
#include <Ethernet.h>
#include <Server.h>
#include <Client.h>

  //--- déclaration du tableau d'adresse MAC ---
  byte mac[] = { 0xDE, 0xAD, 0xBE, 0xEF, 0xFE, 0xED };
  //---- tableau de l'adresse IP de la carte Arduino
  byte ip[] = { 192,168,1,55 }; // le PC a pour IP : 192.168.1.93
  byte passerelle[] = { 192, 168, 1, 1 }; // l'adresse du PC de connexion
  byte masque[] = { 255, 255, 255, 0 }; // idem masque sous-réseau du PC : 255.255.255.0
  // --- Déclaration des objets utiles pour les fonctionnalités utilisées ---
  //--- création de l'objet serveur ----
  EthernetServer serveurHTTP(80); // crée un objet serveur utilisant le port 80 = port HTTP
  //******************** **** ****************************************
  #define ThermistorPIN0 0
    #define ThermistorPIN1 1
      #define ThermistorPIN2 2
        #define ThermistorPIN3 3
          #define ThermistorPIN4 4
            #define ThermistorPIN5 5
              #define ThermistorPIN6 6
                 #define ThermistorPIN7 7
       // float Rf=1000;
        String efficacite = 0;   //Valeur efficacité du systeme en %  
        boolean Auto= false; //Au lancement le mode est en manuel
        float Rpad = 80000; //Resistance diviseur de tension
        float T0 ,T1,T2,T3,T4,T5,T6,T7;   //variable des 8 capteurs de T°
        float Temp; //temperature mesurée  
        float Thermistor(int RawADC) {
        float Rserie = 100000;
        long Resistance=((1024 * Rserie / RawADC) - Rserie);
        Temp = log(Resistance); // sauver le log de la résistance mesurée
        Temp = 1 / (5.9120e-03 + (-4.7272e-04 * Temp) + (1.8902e-06 * Temp * Temp * Temp));
        Temp = Temp - 273.15;                        
        return Temp;
}
 int CalculEfficacite(double insufl, double Exterieur, double Interieur){
 int Efficacite = ((insufl - Exterieur)/(Interieur - Exterieur))*100;
 return Efficacite;
 }
  void AutoOff()
 {
Auto= true;
 }
void setup()   {

//---- initialise la connexion Ethernet avec l'adresse MAC, l'adresse IP et le masque
Ethernet.begin(mac, ip, passerelle, masque);

//---- initialise le serveur ----
serveurHTTP.begin();

//----initialise connexion série
Serial.begin(9600); // initialise connexion série à 9600 bauds
}

void loop(){
// --- ici instructions à exécuter par le programme principal ---
  T0 = Thermistor(analogRead(ThermistorPIN0));//HS
    T1 = Thermistor(analogRead(ThermistorPIN1));//HS
     T2 = Thermistor(analogRead(ThermistorPIN2));
     //  T3 = Thermistor(analogRead(ThermistorPIN3));
        // T4 = Thermistor(analogRead(ThermistorPIN4));
        //   T5 = Thermistor(analogRead(ThermistorPIN5));
             T6 = Thermistor(analogRead(ThermistorPIN6));
                T7 = Thermistor(analogRead(ThermistorPIN7));

 if(Auto)
{   efficacite = (String(CalculEfficacite(T4, T5, T3))+" %");

 }
// crée un objet client basé sur le client connecté au serveur
  EthernetClient client = serveurHTTP.available();
  if (client) { // si l'objet client n'est pas vide
    while (client.connected()) { // tant que le client est connecté
      if (client.available()) { // si des octets sont disponibles en lecture, le test est vrai si il y a au moins 1 octet disponible
     char c = client.read(); // lit l'octet suivant reçu du client (pour vider le buffer au fur à mesure !)
      } // --- fin client.available
     else { // si pas de caractères disponibles = requete client terminée
        // envoi d'une entete standard de réponse http

          client.println("HTTP/1.1 200 OK");
          client.println("Content-Type: text/html");
        
          client.println();
          // envoie les chaines de caractères voulues = du code HTML
          client.println("<HTML>");
          client.print("<HEAD>");
          client.print("<TITLE />Control</title>");//Titre de la page
          client.print("<script type='text/javascript'>function reFresh() {  location.reload(true) } window.setInterval('reFresh()',1000); </script>");
          client.print  ("<body style=background-color:black>");//Fond ecran noir
 
client.println("<font size='16' color='white'><center>Home control</center></font>");//Police titre en vert
client.println("<hr />");//ligne
client.println("<br />");//retour à la ligne
client.println("<center><table>");//border=3 border cellpading=5>"); //Ajout d'un tableau
client.println("<table border width=800 height=400 ");
client.println("<CAPTION><font color='green'size='6'>Indicateurs systeme </CAPTION></font>");
client.println("<br />");
client.print("<input type='button' value='Auto' onClick= AutoOff() />");
client.println("<br />");
client.print("<tr><th><font color='#EFBC45'size='4'>Secteur de controle</th><th><font color='#EFBC45'size='4'>Emplacement sondes</th><th><font color='#EFBC45'size='4'>Temperatures / Etat</th><th><font color='#EFBC45'size='4'>Hygrometrie</th></tr>");

client.print("<tr><td align= center rowspan='3'><font color='#EFECCA'size='4'>Recuperation air vicie</td><td align= center><font color='#EFECCA'size='4'> Cuisine </td><td align= center><font color='#EFECCA'size='4'>");
client.print(T0);
client.print("</td><td align= center><font color='#EFECCA'size='4'>0</td></tr>");

client.print("<tr><td align= center><font color='#EFECCA'size='4'>Buanderie </td><td align= center><font color='#EFECCA'size='4'>");
client.print(T1);
client.print("</td><td align= center><font color='#EFECCA'size='4'>0</td></tr>");

client.print("<tr><td align= center rowspan='2'><font color='#EFECCA'size='4'>VMC</td><td align= center><font color='#EFECCA'size='4'> VMC maison </td><td align= center><font color='#EFECCA'size='4'> Actif / inactif </td></tr>");

client.print("<tr><td align= center><font color='#EFECCA'size='4'> VMC garage </td><td align= center><font color='#EFECCA'size='4'> Actif / inactif </td></tr>");

client.print("<tr><td align= center><font color='#EFECCA'size='4'> Efficacite </td><td align= center><font color='#EFECCA'size='4'>  </td><td align= center><font color='#EFECCA'size='4'>");
client.print(efficacite);
client.print("</td></tr>");

client.println("</table></center><br /></BODY></HTML>");
                          break;
}
    }
    // on donne au navigateur le temps de recevoir les données
    delay(1);
    // fermeture de la connexion avec le client
    client.stop();
  }
}

 
« Last Edit: November 28, 2012, 03:58:50 pm by lolo81 » Logged

Débutant mais acharné!!

Ile-de-France (92 sud), France
Offline Offline
Edison Member
*
Karma: 23
Posts: 2054
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

Dans la page HTML, tu execute du code Javascript qui s'execute dans le navigateur et qui peut modifier des varables Javascript dans le navigateur.
Aucune chance que ta variable C se téléporte magiquement dans le navigateur.

Récupère la lib Webduino et rejarde les exemples utilisant AJAX.
Logged

Barbuduino: Arduino sur Breadboard & VinciDuino: Clone Leonardo // WR703: Mini-routeur hacké // LauchPad MSP430 et Stellaris // Panda II Arduino-like .NetMF sous VisualC#
RTFC: Read That F.....g Code / RTFD: Read That F.....g Doc / RTFDS: Read That F.....g DataSheet / RTFS: Read That F.....g Schematic / Wot da ya wanna D.I.Y. today ?

Offline Offline
Newbie
*
Karma: 0
Posts: 43
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Bonjour,
ben faut dire que ça fait plus d'une semaine que je cherche a faire fonctionner un bouton de ma page HTML,  j'ai consulté 3 million de page web
et malgré tous les exemples consultés je n'est toujours pas compris le démarche.  smiley-red
Je débute et le HTML, CSS, AJAX, et compagnie c'est du nouveau pour moi alors difficile même en consultant des exemples d'y parvenir.
Je passe du coq à l’âne, mais n'y a t-il pas une solution plus rapide pour afficher le résultat du code de la page web sans devoir systématiquement la chargé dans l'Arduino?
Actuellement, j'upload à chaque petites modification de code, j'ai peur que la carte ne supporte pas ça.

 


Logged

Débutant mais acharné!!

Forum Moderator
Geneva
Offline Offline
Faraday Member
*****
Karma: 24
Posts: 3171
Yoplait... le pt'it suisse
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

Actuellement, j'upload à chaque petites modification de code, j'ai peur que la carte ne supporte pas ça.


Avant qu'elle ne foire pour ça, tu as de la marge  smiley-lol
Logged

MacBook intel core 2 duo  os X snow Leopard 10.6<br/> eMac PPc G4  os X Leopard 10.5<br/>powerbook G4 os X Leopard 10.5
imac PPC G3 os X Pa

Ile-de-France (92 sud), France
Offline Offline
Edison Member
*
Karma: 23
Posts: 2054
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

@lolo

Y'a pas de problème à charger 50 fois la page Web
Mais sinon, il n'est pas indispensable que la page Web soit sur l'Arduino.
Il est tout a fait possible de décorréler l'hébergement de la page web et le code Arduino qui gère les cpateurs, E/S, ...

Tu peux placer la page web sur n'importe quel serveur Web (que ce soit un PC chez toi, un serveur de pages perso (free, orange, Google Site), ...)
Ensuite la communication avec Arduino reste indépendante et tu peux utiliser plusieurs méthodes :
- JavaScript + AJAX (Code JavaScript qui s'exécute dans le navigateur et qui fait des requête POST/GET vers un serveur Webduino sur Arduino)
- JavaScript + AJAX + PHP Socket (code JavaScript qui s'exécute dans le navigateur et qui fait des requêtes POST/GET vers un script PHP qui a son tour fait des socket TCP ou UDP vers Arduino) (Il faut pour cela que le serveur Web+PHP sur lequel s'exécute le PHP ait les autorisations pour faire des sockets)
- JavaScript + WebSocket (Code Jascript HTML5 qui ouvre une WebSocket vers un serveur de WebSocket sur Arduino)
- JavaScript + WebSocket + PHP (Mélange des 2 méthodes ci-dessus)
- JavaScript + ServerSideEvent

Depuis le JavaScript il existe en gros 3 méthodes pour communiquer vers une autre machine :

- AJAX : requêtes POST/GET mono-directionnelles vers un serveur Web (PC ou Webduino) : Les communications se font toujours à l'initiative du JavaScript. L'Arduino ne peut pas signaler des événements de lui-même.
- HTML5 WebSocket : communication bidirectionnelle. Chaque coté peut décider d'envoyer un message. Coté Arduino pour un serveur de Websocket voir ici et
- HTML5 ServerSideEvent : communication mono-directionelle d'un serveur Web (PC ou Arduino) vers le navigateur

Le 1er est le plus facile a mettre en oeuvre mais comme il est mono-directionel, il faut que le script JavaScript consulte régulièrement l'Arduino pour être a jour.
Le 2nd est le plus complet mais le standard des WebSocket est encore mal supporté et seul Chrome et Firefox les supportent aujourd'hui (je ne sais pas pour Safari). IE c'est non.
Le 3eme est trop limité.
Il est difficile de mélanger 2 ou plus de ces méthodes car les libs à utiliser coté Arduino sont différentes. Ca demanderait pas mal de boulot pour arriver à une solution complète.

Logged

Barbuduino: Arduino sur Breadboard & VinciDuino: Clone Leonardo // WR703: Mini-routeur hacké // LauchPad MSP430 et Stellaris // Panda II Arduino-like .NetMF sous VisualC#
RTFC: Read That F.....g Code / RTFD: Read That F.....g Doc / RTFDS: Read That F.....g DataSheet / RTFS: Read That F.....g Schematic / Wot da ya wanna D.I.Y. today ?

France
Offline Offline
Faraday Member
**
Karma: 52
Posts: 5341
Arduino Hacker
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

Bonjour,

Actuellement, j'upload à chaque petites modification de code, j'ai peur que la carte ne supporte pas ça.

Avant qu'elle ne foire pour ça, tu as de la marge  smiley-lol
Plus de 10 000 uploads, ça fait une sacrée marge smiley-mr-green
Logged

Des news, des tuto et plein de bonne chose sur http://skyduino.wordpress.com !

Offline Offline
Newbie
*
Karma: 0
Posts: 2
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Merci Barbudor pour cette présentation super limpide !!!
Logged

Offline Offline
Edison Member
*
Karma: 9
Posts: 1650
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

bonjour,
si je me trompe pas tu peux faire la même chose mais avec un <a href="?off" onclick="......"
en plus je ne vois la fonction null part dans ton code.
Logged

France, Lyon 6°
Offline Offline
Full Member
***
Karma: 0
Posts: 144
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Salut, regarde la console d'erreurs de ton navigateur.
Sous Firefox, c'est Maj. + Cmd(pomme) + J chez mac et chez les autres OS c'est Maj. + Contrôle + J.
Je ne sais pas comment l'ouvrir avec un raccourcis chez les autres navigateurs...
Dans les menus, ça doit être Outils/Console d'erreurs.
Sinon, il faut chercher.

P.S. : N'oublie pas d'effacer la liste d'erreurs avant de (re)charger la page.

Salut !
Logged

- Arduino UNO R3;
- PowerBook G4;
  - Arduino (C)
  - Eclipse (Java)
  - wxLua (µLua)
  - TextWrangler (HTML + JS)
- (3)DS et bientôt R4 (po

Pages: [1]   Go Up
Jump to: