View source for Web Page as Remote Control Example


In this example, you will make a simple web page that will activate a function on a Particle microcontroller to flash the built in LED on pin D7.


== Particle Arduino Code ==

<pre>
void setup()
{
  // register the cloud function
  Particle.function("turnOnLight", turnOnLight);
  pinMode(D7, OUTPUT);
}
 
void loop()
{
 
}
 
int turnOnLight(String command)
{
   digitalWrite(D7, HIGH);
   delay(1000);
   digitalWrite(D7, LOW);
}
</pre>


== Web Code ==

In the following code, replace "Your Device ID Here", "Your Access Token here" with the values specific to your Particle device and your account. You can get your DEVICE ID from the DEVICES tab on the left of spark IDE and the ACCESS TOKEN under SETTINGS.

<pre>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Made with Thimble</title>
  <script src="https://code.jquery.com/jquery-1.11.2.min.js"></script>
  <script src="https://andyforest.github.io/sparkControl/js/sparkControl.js"></script>
  <script type="text/javascript">
    var particlePhoton = new sparkControl("Your Device ID Here", "Your Access Token here");
  </script>
</head>
<body>

  <h1>Remote control interface</h1>
  
  <p>
    <button onclick="particlePhoton.callFunction('turnOnLight', '');">Activate LED</button>
  </p>
  
  
  <p>
    <a href="javascript:particlePhoton.callFunction('turnOnLight', '');">Activate LED</a>
  </p>

</body>
</html>
</pre>