[Photon] 3 servos remote controlled by html


#1

hi i have asking for some help some days ago and i have working with some already done code,
you can see the original code here
AGAIN NOT MY CODE I ONLY EDITED, DONT WANT CREDITS
NOTE: you can control from several Computers.

So, in my photon the code i used was on the link on the top but its only for 1 servo, but i need 3 servos, so i edited and see the result:

    // PARTICLE DONT NEED #INCLUUDE <servo.h>
    Servo serv;
    Servo serv1;
    Servo serv2;
    int pos = 0;
    
    int pos1 = 0;
    int pos2=0;
    
    void setup() {
        
        serv.attach(D2);
        Spark.function("setpos", setPos);
        Spark.variable("getpos", &pos, INT);
        
        serv1.attach(D0);
        Spark.function("setpos1", setPos1);
        Spark.variable("getpos1", &pos1, INT);
        
            serv2.attach(D3);
        Spark.function("setpos2", setPos2);
        Spark.variable("getpos2", &pos2, INT);
    }
    
    void loop() {
    }
    
    int setPos(String pstn) {
        pos = pstn.toInt();
        serv.write(pos);
        return pos;
    }
    
    int setPos1(String pstn1) {
        pos1 = pstn1.toInt();
        serv1.write(pos1);
        return pos1;
    }
    
    int setPos2(String pstn2) {
        pos2 = pstn2.toInt();
        serv2.write(pos2);
        return pos2;
    }

and the HTML will look like this:

    <html>
      <head>
        <style>
        body {
          margin: 1em auto;
          max-width: 45em;
          padding: 0.8em;
          background: white;
        }
        </style>
      </head>
      <body>
        <h1>Braço Esquerdo</h1>
        <input type="range" min="0" max="180" value="0" onchange="showValue(this.value)"/>
        <span id="range">0</span>
        <script type="text/javascript">
        function showValue(newValue) {
          document.getElementById("range").innerHTML=newValue;
          var request = new XMLHttpRequest();
         var dev_id = 'YOUR ID';
          var access = 'YOUR TOKEN';
          var data = 'params='+newValue+'&access_token='+access;
          var url = 'https://api.particle.io/v1/devices/'+dev_id+'/setpos/';
          request.open('POST', url, true);
          request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
          request.send(data);
        }
        </script>
    
        <h1>Braço Direito</h1>
        <input type="range" min="0" max="180" value="0" onchange="showValue1(this.value)"/>
        <span id="range1">0</span>
        <script type="text/javascript">
        function showValue1(newValue2) {
          document.getElementById("range1").innerHTML=newValue2;
          var request1 = new XMLHttpRequest();
          var dev_id1 = 'YOUR ID';
          var access1 = 'YOUR TOKEN';
          var data1 = 'params='+newValue2+'&access_token='+access1;
          var url1 = 'https://api.particle.io/v1/devices/'+dev_id1+'/setpos1/';
          request1.open('POST', url1, true);
          request1.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
          request1.send(data1);
        }
        </script>
    
    <h1>Tronco</h1>
        <input type="range" min="0" max="180" value="0" onchange="showValue2(this.value)"/>
        <span id="range2">0</span>
        <script type="text/javascript">
        function showValue2(newValue3) {
          document.getElementById("range2").innerHTML=newValue3;
          var request2 = new XMLHttpRequest();
          var dev_id2 = 'YOUR ID';
          var access2 = 'YOUR TOKEN';
          var data2 = 'params='+newValue3+'&access_token='+access2;
          var url2 = 'https://api.particle.io/v1/devices/'+dev_id2+'/setpos2/';
          request2.open('POST', url2, true);
          request2.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
          request2.send(data2);
        }
        </script>
    
    
      </body>
    </html>

this have taken me 4 hours to do it and now i have shared to you, make a good use of it. and thanks the developer on HERE


[SOLVED]Photon + html problem (led)
split this topic #2

2 posts were merged into an existing topic: 3 servos + html


unlisted #3