int led = D0;
int photoresistor = A0;
int analogvalue;
void setup() {
pinMode(led,OUTPUT);
pinMode(photoresistor,INPUT);
Particle.variable("analogvalue", &analogvalue, INT);
Particle.function("led",ledToggle);
}
void loop() {
analogvalue = analogRead(photoresistor);
delay(1000);
}
int ledToggle(String command) {
if (command=="on") {
digitalWrite(led,LOW);
return 1;
}
else if (command=="off") {
digitalWrite(led,HIGH);
return 0;
}
else {
return -1;
}
}
<!DOCTYPE html>
<html>
<title>Particle Controller</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<body>
<div class="w3-container">
<center><h2>Particle Photon Controller</h2></center>
</div>
<div class="w3-row">
<div class="w3-col s4 w3-white w3-center">
<div class="w3-panel w3-card" id="p1">
<p>1111</p>
<form action="" method="get">
<input type="text" id="ip1" class="ip1" placeholder="Photon ID" value="<replace it with your device ID>"></input><br><p></p>
<button type="button" id="D1-on" class="button button1" >ON</button>
<button type="button" id="D1-off" class="button button3" >OFF</button>
<p>
<span id="av1"></span><br>
<button type="button" id="ana1" class="button button3" >Read Analog Value</button>
</p>
<p></p>
</form>
</div>
</div>
</body>
</html>
<script>
document.getElementById('D1-on').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/led?access_token=<Replace this with your access token>",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded"
},
"data": {
"args": "on"
}
}
$.ajax(settings).done(function (response) {
console.log(response);
});
});
document.getElementById('D1-off').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/led?access_token=<Replace this with your access token>",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded"
},
"data": {
"args": "off"
}
}
$.ajax(settings).done(function (response) {
console.log(response);
});
});
document.getElementById('ana1').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/analogvalue/?access_token=<Replace this with your access token>",
"method": "GET",
"headers": {}
}
$.ajax(settings).done(function (response) {
var inputY = response.result;
var xMax = 255;
var xMin = 0;
var yMax = 4095;
var yMin = 0;
var percent = (inputY - yMin) / (yMax - yMin);
var outputX = parseInt(percent * (xMax - xMin) + xMin);
document.getElementById("av1").innerHTML = outputX;
document.getElementById("p1").style.background = "rgb(" +outputX+ ", "+outputX+ ", "+ outputX+")";
//console.log(response.result);
});
});
</script>
<!DOCTYPE html>
<html>
<title>Particle Controller</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<body>
<div class="w3-container">
<center><h2>Particle Photon Controller</h2></center>
</div>
<div class="w3-row">
<div class="w3-col s4 w3-white w3-center">
<div class="w3-panel w3-card" id="p1">
<p>1111</p>
<form action="" method="get">
<input type="text" id="ip1" class="ip1" placeholder="Photon ID" value="<replace your device ID>"></input><br><p></p>
<button type="button" id="D1-on" class="button button1" >ON</button>
<button type="button" id="D1-off" class="button button3" >OFF</button>
<p>
<span id="av1"></span><br>
<button type="button" id="ana1" class="button button3" >Read Analog Value</button>
</p>
<p></p>
</form>
</div>
</div>
</body>
<script>
document.getElementById('D1-on').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/led?access_token=<Replace this with your access token>",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded"
},
"data": {
"args": "on"
}
}
$.ajax(settings).done(function (response) {
console.log(response);
});
});
document.getElementById('D1-off').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/led?access_token=<Replace this with your access token>",
"method": "POST",
"headers": {
"content-type": "application/x-www-form-urlencoded"
},
"data": {
"args": "off"
}
}
$.ajax(settings).done(function (response) {
console.log(response);
});
});
document.getElementById('ana1').addEventListener('click', function() {
var ip1 = document.getElementById('ip1').value;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://api.particle.io/v1/devices/" + ip1 + "/analogvalue/?access_token=<Replace this with your access token>",
"method": "GET",
"headers": {}
}
$.ajax(settings).done(function (response) {
var inputY = response.result;
var xMax = 255;
var xMin = 0;
var yMax = 4095;
var yMin = 0;
var percent = (inputY - yMin) / (yMax - yMin);
var outputX = parseInt(percent * (xMax - xMin) + xMin);
document.getElementById("av1").innerHTML = outputX;
document.getElementById("p1").style.background = "rgb(" +outputX+ ", "+outputX+ ", "+ outputX+")";
//console.log(response.result);
});
});
</script>
</html>