Visualizzazione dei risultati da 1 a 10 su 10
  1. #1
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56

    script javascript per domotica raspberry pi

    Salve, sto facendo un piccolo progetto di domotica con il raspberry pi che gestisce un piccolo server apache, da un client collegato alla stessa rete del raspberry, digito nel browser l'indirizzo del raspberry ed esce una pagina html per il controllo di led (per ora) collegati alla gpio. Per ora riesco a far accendere e spegnere un solo led, potreste dirmi come posso fare per far accendere e spegnere altri led? non sono molto ferrato con javascript.
    la pagina web è stata scritta in html, bootstrap e css.
    poi ci sono due file php per accendere e spegnere il led
    e del codice javascript incorporato nella pagina html
    grazie in anticipo, perdonatemi se la sezione non è giusta.
    codice HTML:
    <!DOCTYPE html><html lang="en"><head>  <meta charset="UTF-8">  <meta name="viewport" content="width=device-width, initial-scale=1.0">  <meta http-equiv="X-UA-Compatible" content="ie=edge">  <title>DOMO House</title>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>  <link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Slab:100,300,400|Roboto:100" rel="stylesheet">  <!--link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet"-->  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">  <link rel="stylesheet" href="css/style.css">  <script type="text/javascript">        $(document).ready(function(){          $('#accendi').click(function(){            var a= new XMLHttpRequest();            a.open("GET","accendi.php");            a.onreadystatechange=function() {              if(a.readyState==4){                if(a.status==200){                }                else alert ("HTTP ERROR");              }            }            a.send();          });          $('#spegni').click(function(){            var a= new XMLHttpRequest();            a.open("GET","spegni.php");            a.onreadystatechange=function() {              if(a.readyState==4){                if(a.status==200){                }                else alert ("HTTP ERROR");              }            }            a.send();          });        });    </script></head>
    <body>  <nav class="navbar navbar-inverse">  <div class="container">    <!-- Brand and toggle get grouped for better mobile display -->    <div class="navbar-header">      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">        <span class="sr-only">Toggle navigation</span>        <span class="icon-bar"></span>        <span class="icon-bar"></span>        <span class="icon-bar"></span>      </button>      <a class="navbar-brand" href="#">DOMO House</a>    </div>
        <!-- Collect the nav links, forms, and other content for toggling -->    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">      <ul class="nav navbar-nav navbar-right">        <li class="active"><a href="#">Piano Terra<span class="sr-only">(current)</span></a></li>        <li><a href="#">Primo Piano</a></li>        <li><a href="#">Secondo Piano</a></li>        <li class="dropdown">          <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Stanza<span class="caret"></span></a>          <ul class="dropdown-menu">            <li><a href="#">Taverna</a></li>            <li role="separator" class="divider"></li>            <li><a href="#">Bagno</a></li>          </ul>        </li>      </ul>    </div><!-- /.navbar-collapse -->  </div><!-- /.container-fluid --></nav>
      <div class="container">    <div class="row">      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <button type="button" class="btn btn-success bottone spazio" id="accendi" name="CameraON">Accendi</button>        <button type="button" class="btn btn-danger bottone" id="spegni" name="CameraOFF">Spegni</button>      </div>      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>        <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>      </div>      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>        <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>      </div>      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>        <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>      </div>      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>        <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>      </div>      <div class="col-xs-12 col-md-6">        <h1>Luci</h1>        <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>        <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>      </div>    </div>  </div>
      <footer>    <p class="text-center">&copy - DOMO House di Cosmo Ferrigno 2017</p>  </footer>  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script></body></html>
    Codice PHP:
    <?php  system("gpio -g mode 17 out");  system("gpio -g write 17 1");?>
    Codice PHP:
    <?php  system("gpio -g mode 17 out");  system("gpio -g write 17 0");?>

  2. #2
    Moderatore di Javascript L'avatar di ciro78
    Registrato dal
    Sep 2000
    residenza
    Napoli
    Messaggi
    8,505
    ciao,
    meglio se formatti meglio il codice . altrimenti non si capisce nulla.
    Ciro Marotta - Programmatore JAVA - PHP
    Preferisco un fallimento alle mie condizioni che un successo alle condizioni altrui.


  3. #3
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56
    ho copiato il codice direttamente dall'editor che utilizzo ed era formattato, come devo fare'

  4. #4
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56
    codice:
    <!DOCTYPE html><html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>DOMO House</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Slab:100,300,400|Roboto:100" rel="stylesheet">
      <!--link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet"-->
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      <link rel="stylesheet" href="css/style.css">
      <script type="text/javascript">
            $(document).ready(function(){
              $('#accendi').click(function(){
                var a= new XMLHttpRequest();
                a.open("GET","accendi.php");
                a.onreadystatechange=function() {
                  if(a.readyState==4){
                    if(a.status==200){
                    }
                    else alert ("HTTP ERROR");
                  }
                }
                a.send();
              });
              $('#spegni').click(function(){
                var a= new XMLHttpRequest();
                a.open("GET","spegni.php");
                a.onreadystatechange=function() {
                  if(a.readyState==4){
                    if(a.status==200){
                    }
                    else alert ("HTTP ERROR");
                  }
                }
                a.send();
              });
            });
        </script>
    </head>
    
    
    <body>
      <nav class="navbar navbar-inverse">
      <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">DOMO House</a>
        </div>
    
    
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
            <li class="active"><a href="#">Piano Terra<span class="sr-only">(current)</span></a></li>
            <li><a href="#">Primo Piano</a></li>
            <li><a href="#">Secondo Piano</a></li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Stanza<span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Taverna</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Bagno</a></li>
              </ul>
            </li>
          </ul>
        </div><!-- /.navbar-collapse -->
      </div><!-- /.container-fluid -->
    </nav>
    
    
      <div class="container">
        <div class="row">
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <button type="button" class="btn btn-success bottone spazio" id="accendi" name="CameraON">Accendi</button>
            <button type="button" class="btn btn-danger bottone" id="spegni" name="CameraOFF">Spegni</button>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
        </div>
      </div>
    
    
      <footer>
        <p class="text-center">&copy - DOMO House di Cosmo Ferrigno 2017</p>
      </footer>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    </body>
    </html>
    Quote Originariamente inviata da ciro78 Visualizza il messaggio
    ciao,
    meglio se formatti meglio il codice . altrimenti non si capisce nulla.

  5. #5
    Il punto sta nel fatto che:

    1) Il codice php che sta in accendi.php e spegni.php è fisso su una data porta GPIO, quindi accenderai e spegnerai sempre e solo quella; devi invece passare ad accendi.php e spegni.php un parametro che gli dica cosa accendere o spegnere:

    accendi.php?port=17

    <?php system("gpio -g mode ".intval($_GET["port"])." out"); system("gpio -g write ".intval($_GET["port"])." 1");?>

    (nota che sarebbe meglio controllare di più che cosa viene accettato in $_GET["port"])

    2) il tuo javascript deve per ogni bottone accendi/spegni passare la giusta porta GPIO che corrisponde al led che vuoi accendere.
    "Le uniche cose che sbagli sono quelle che non provi a fare."
    Atipica

  6. #6
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56
    ok
    per non scrivere tutto quel codice javascript per ogni porta GPIO come posso fare? Utilizzando forse qualche ciclo for, ma come?
    Quote Originariamente inviata da Shores Visualizza il messaggio
    Il punto sta nel fatto che:

    1) Il codice php che sta in accendi.php e spegni.php è fisso su una data porta GPIO, quindi accenderai e spegnerai sempre e solo quella; devi invece passare ad accendi.php e spegni.php un parametro che gli dica cosa accendere o spegnere:

    accendi.php?port=17

    <?php system("gpio -g mode ".intval($_GET["port"])." out"); system("gpio -g write ".intval($_GET["port"])." 1");?>

    (nota che sarebbe meglio controllare di più che cosa viene accettato in $_GET["port"])

    2) il tuo javascript deve per ogni bottone accendi/spegni passare la giusta porta GPIO che corrisponde al led che vuoi accendere.

  7. #7
    Puoi aggiungere a ciascun link cliccabile un attributo del tipo data-port="17" e così via, che vai a leggere dalla funzione che reagisce all'onclick, e che aggiungi alla url accendi.php o spegni.php:

    a.open("GET","accendi.php?port="+$(this).attr('dat a-port');
    "Le uniche cose che sbagli sono quelle che non provi a fare."
    Atipica

  8. #8
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56
    sbaglio nel codice che mi hai mandato "a.open....." manca una parentesi tonda chiusa?

  9. #9
    Si scusami, la fretta...
    "Le uniche cose che sbagli sono quelle che non provi a fare."
    Atipica

  10. #10
    Utente di HTML.it
    Registrato dal
    Jun 2017
    Messaggi
    56
    codice:
    <!DOCTYPE html><html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <meta http-equiv="X-UA-Compatible" content="ie=edge">
      <title>DOMO House</title>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <link href="https://fonts.googleapis.com/css?family=Open+Sans|Roboto+Slab:100,300,400|Roboto:100" rel="stylesheet">
      <!--link href="https://fonts.googleapis.com/css?family=Roboto+Slab" rel="stylesheet"-->
      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      <link rel="stylesheet" href="css/style.css">
      <script type="text/javascript">
            $(document).ready(function(){
              $('#accendi').click(function(){
                var a= new XMLHttpRequest();
                a.open("GET","accendi.php?port="+$(this).attr('dat a-port'));
                a.onreadystatechange=function() {
                  if(a.readyState==4){
                    if(a.status==200){
                    }
                    else alert ("HTTP ERROR");
                  }
                }
                a.send();
              });
              $('#spegni').click(function(){
                var a= new XMLHttpRequest();
                a.open("GET","spegni.php?port=17");
                a.onreadystatechange=function() {
                  if(a.readyState==4){
                    if(a.status==200){
                    }
                    else alert ("HTTP ERROR");
                  }
                }
                a.send();
              });
            });
        </script>
    </head>
    
    
    <body>
      <nav class="navbar navbar-inverse">
      <div class="container">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">DOMO House</a>
        </div>
    
    
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav navbar-right">
            <li class="active"><a href="#">Piano Terra<span class="sr-only">(current)</span></a></li>
            <li><a href="#">Primo Piano</a></li>
            <li><a href="#">Secondo Piano</a></li>
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Stanza<span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Taverna</a></li>
                <li role="separator" class="divider"></li>
                <li><a href="#">Bagno</a></li>
              </ul>
            </li>
          </ul>
        </div><!-- /.navbar-collapse -->
      </div><!-- /.container-fluid -->
    </nav>
    
    
      <div class="container">
        <div class="row">
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <button type="button" class="btn btn-success bottone spazio" id="accendi" data-port="17" name="CameraON">Accendi</button>
            <button type="button" class="btn btn-danger bottone" id="spegni" name="CameraOFF">Spegni</button>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
          <div class="col-xs-12 col-md-6">
            <h1>Luci</h1>
            <a class="btn btn-success bottone spazio" href="#" role="button">Accendi</a>
            <a class="btn btn-danger bottone" href="#" role="button">Spegni</a>
          </div>
        </div>
      </div>
    
    
      <footer>
        <p class="text-center">&copy - DOMO House di Cosmo Ferrigno 2017</p>
      </footer>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    </body>
    </html>
    questo è tutto il codice modifica.. ma non funziona, al codice php ho apportato le modifiche che hai detto prima
    Quote Originariamente inviata da Shores Visualizza il messaggio
    Si scusami, la fretta...

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.