Pages: [1]   Go Down
Author Topic: Confuso tra GET, jQuery, slider con TinyWebServer  (Read 1204 times)
0 Members and 1 Guest are viewing this topic.
Offline Offline
Full Member
***
Karma: 1
Posts: 169
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Ciao
Grazie a pablos71 che mi ha aiutato tantissimo, sono riuscito a variare l' intensità di un led utilizzando
uno slider via jquery.
La parte post non è perfetta ma comunque è funzionante!
ora devo modificare la posizione_slider non da un valore arbitrario di solito 0 ma dal valore passato da arduino,
lo stesso valore che comanda il pwm del led
per intenderci dallo sketck:
Code:
analogWrite(Pin3, pwm1);
client.print(";");
        client.print(pwm1);
        client.print(";");
 Pensavo che una chiamata GET  jQuery fosse la cosa giusta, come l' esempio messo a disposizione da Alessandro Migliorini,
  ma aimè non funziona.
  ecco la pagina index.htm:
  
  
Code:
<!DOCTYPE html>
<html>
<head>
  <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<style>
#demo-frame > div.demo { padding: 10px !important; };
</style>
<script>
var posizione_slider;
   var arduino_url = "http://192.168.0.200";
var get_url = "getdata";
var arduino_values = new Array();
var values_separator = ";";  // valore per separare i valori in ricezione
//   Funzione per prendere il valore dello slider
function ricevi-dati()
{
$.ajax({             //usiamo jQuery.ajax per la chiamata a/sincrona - http://api.jquery.com/jQuery.ajax/
         type: "GET",
cache: false,
         url: arduino_url,
         data:  get_url,
         success:
         function(result) //creiamo un array dei valori tornati da Arduino, separati da values_separator (es: 13;24;166)
{

arduino_values = result.split(values_separator);
 posizione_slider = parseFloat(arduino_value[0] );
//var posizione_slider2 = parseFloat(arduino_value[1] ); //futuri slider
//var posizione_slider3 = parseFloat(arduino_value[2] ); //futuri slider
//risposta-server all'utente?
                     $("#risposta-server").append("Comando ESEGUITO con successo");
                 },
       error:
         function()
{
$("#risposta-server").append("Comando Non ESEGUITO ci sono degli errori!");
                 }
  });
};
//   Funzione per creare uno slider con jquery
$(function() {


$( "#slider-vertical" ).slider({
orientation: "vertical",
                        //orientation: "horizontal",
//range: "min",
             animate: true,
min: 0,
max: 255,

//value: 0,
value: posizione_slider,// <===Valore dello slider alla partenza della pagina
slide: function( event, ui ) {
$( "#testo3" ).val( ui.value );
$.ajax({type: "POST", data: $( "#testo3" ).val( ui.value ), dataType: "text", cache: false, url: ind,  
      success:function(risposta)
      {              
        document.form1.areatesto.value  += risposta ;
      }  
   });
}
});
$( "#testo3" ).val( $( "#slider-vertical" ).slider( "value" ) );
});

var msg="";
var ind= "/Istruzioni_da_web";

 
$(document).ready(
    function(){
    msg="Connessione.....#";
    invia_dati("/Istruzioni_da_web");

var posizione = document.getElementById('testo3');
      ricevi-dati();  
    });
var posizione = document.getElementById('slider-vertical');
</script>
<title>prova TinyWebServere slider nono</title>
</head>
  <body>
  
  <div class="demo">
<form name="form1">
<textarea cols="80" rows="1" id="textareaname" name="areatesto">
</textarea>
<p><input type="text"  name="testo3" id="testo3"  style="border:1; color:#ff0000; font-weight:bold;" />

</p>
  </form>
  <p><div id="slider-vertical" style="height:200px;"></div></p>
  </div>
 <div id="risposta-server">risopsta dal server: </div>
  </body>
</html>
 
  
  
  leggo sempre:  Comando Non ESEGUITO ci sono degli errori!
  anche se lo slider fa il suo lavoro  ovviamente al Refresh della pagina lo slider parte da 0.
  
  Grazie

  Luca
« Last Edit: January 24, 2012, 01:24:38 pm by llluca » Logged

Genova
Offline Offline
Faraday Member
**
Karma: 38
Posts: 3285
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Ciao Luca, bhe vedo che ti sei dato da fare col jquery  smiley-grin, bel lavoro, scusami se ho sospeso il discorso slider, ci sono state le vacanze e ho sospeso un po' tutto.  Se vuoi aggiornarmi ti prometto che in queste sere riprendo l'ambaradan e ci lavoro su, una  una soluzione si trova sempre, se mi vuoi aggiornare su cosa non funziona o cosa non è perfetto, riprendo a studiare i file.

Rimembrami smiley, il tuo problema era che quando il client si connette ad arduino lo slider varialuce sul browser ti parte da 0 invece di andare sul valore reale del pin pwm?

ciao
« Last Edit: January 24, 2012, 06:14:31 pm by pablos » Logged

no comment

Offline Offline
Full Member
***
Karma: 1
Posts: 169
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

ciao  pablos ( ?71 smiley )
GRAZIE per il tuo preziosissimo aiuto.

Hai esattamente centrato il problema, che io dividerei in due per ragioni di studio.
La pagina iniziale con il valore richiesto
Code:
var posizione_slider;
E in un secondo tempo un aggiornamento dello stesso valore dovuto ad altro browser o a
Routine future dello  sketck.


Luca
Logged

Lab
Offline Offline
Newbie
*
Karma: 0
Posts: 38
Arduino rocks
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

Ho da poco iniziato anch'io a smanettare con l'ethernet shield. Avete, per caso, risolto il problema dello slider?

Grazie
Logged


Genova
Offline Offline
Faraday Member
**
Karma: 38
Posts: 3285
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

il problema dello slider lo risolvi leggendo la posizione ogni x tempo,
ad esempio:

se nella stessa funzione js leggi la pos e hai un send dati verso arduino della posizione ottieni una montagna di informazioni da far digerire ad arduino con conseguente crash

la lettura della posizione va fatta ogni xxx ms (400-500) e poi inviata ad arduino per aggiornarlo.


contrariamente per aggiornare la posizione dello slider usando la tinywebserver devi inviare il valore PWM del pin alla funzione ajax che provvederà a spostarlo usando i parametri del CSS


concludendo:
quando sposti tu lo slider a video arduino varierà il valore pwm sul pin
se sarà il software arduino a variare il valore del pin pwm lo slider a video si sposterà da solo

ciao  
« Last Edit: June 29, 2012, 06:24:44 am by pablos » Logged

no comment

Lab
Offline Offline
Newbie
*
Karma: 0
Posts: 38
Arduino rocks
View Profile
WWW
 Bigger Bigger  Smaller Smaller  Reset Reset

Siccome sono alle prime armi, ti sarei grato se potessi postare le modifiche da aggiungere nel codice di Illuca.

Grazie mille
Logged


Genova
Offline Offline
Faraday Member
**
Karma: 38
Posts: 3285
View Profile
 Bigger Bigger  Smaller Smaller  Reset Reset

Non le ho le sue modifiche a me lo slider non serviva, lo dovrei scrivere il codice, però ti ho detto come si fa.
butta giù qualcosa e ti possiamo aiutare
Logged

no comment

Pages: [1]   Go Up
Jump to: