Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
//Tutorial 1 Reading Electric imp April input from JQM web app
//Imp & Agent are written in squirrel-lang.org They should have a .NUT extension.
//but I've used .js so the editor will use colour highlighting.
//T1 Aprill Digital in
// Array that holds the state of each pin
pinState <- [ 0, 0, 0, 0, 0, 0];
// Pins array channel 1 is channelPin[0] in array
Pins <- [ hardware.pin1, hardware.pin2, hardware.pin5, hardware.pin7, hardware.pin8, hardware.pin9 ];
// Register imp
imp.configure("T1: April Digital in",[],[]);
server.log("T1: April Digital in - v1.0");
// Event handler for state changes
function pinEvent()
{
// Idle for 50ms to allow switch to settle
imp.sleep(0.05);
// Read each switch
for(local _pin=0; _pin<2; _pin++)
{
// Get switch state
local state = Pins[_pin].read();
// State changed?
if(state != pinState[_pin])
{
// Update pin sate
pinState[_pin] = state;
}
}
// send pin state to Agent
agent.send("impValues",{pin1=pinState[0],pin2=pinState[1],rssi=imp.rssi(),vdd=hardware.voltage(),bssid=imp.getbssid(),mac=imp.getmacaddress()});
}
// Configure input pins with internal pull-up
for(local _pin=0; _pin<6; _pin++) Pins[_pin].configure(DIGITAL_IN_PULLUP, pinEvent);
// Get pin state on bootup
pinEvent();
//T1 Aprill Digital in
server.log("Agent: start Digital in v1.0");
_pin1 <- "";
_pin2 <- "";
_tmp <- "";
_rh <- "";
_rssi <-"";
_vdd <-"";
_bssid <-"";
_mac <-"";
function sendIMPvalues(request,res){
local vars = {
"pin1": ""+_pin1+"",
"pin2": ""+_pin2+"",
"rssi": ""+_rssi+"",
"vdd": ""+_vdd+""
"bssid": ""+_bssid+"",
"mac": ""+_mac+""
}
local jvars = http.jsonencode(vars);
res.header("Access-Control-Allow-Origin", "*");
res.send(200,jvars);
}
// When HTTP request comes in handel with sendIMPvalues
http.onrequest(sendIMPvalues);
// Process msg from imp
device.on("impValues",function(iv){
server.log("agent: impValues:"+iv.pin1+"|"+iv.pin2+"|"+iv.rssi+"|"+iv.vdd+"|"+iv.bssid+"|"+iv.mac);
_pin1 = iv.pin1;
_pin2 = iv.pin2;
_rssi = iv.rssi;
_vdd = iv.vdd;
_bssid = iv.bssid;
_mac = iv.mac;
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="apple-touch-startup-image" media="(device-width: 320px)" href="cc_startup.png" />
<link rel="apple-touch-icon" href="cc_screen_icon.png" />
<title>T1: April - Digital In</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
<script>
$( function() {
var externalURL ="";
if (localStorage["agentURL"]) {
externalURL=localStorage["agentURL"];
}
var pollRate ="1000";
if (localStorage["pollRate"]) {
pollRate=localStorage["pollRate"];
}
function poll(){
$.ajax({
type: "get",
url: "https://agent.electricimp.com/"+externalURL,
dataType: "json",
success: function(agentMsg) {
console.log("agent-msg:"+agentMsg.pin1);
updateToggle("#pin1",agentMsg.pin1);
updateToggle("#pin2",agentMsg.pin2);
$("#rssi").html(agentMsg.rssi+" dBm");
$("#vdd").html(agentMsg.vdd+" vdc");
$("#bssid").html(agentMsg.bssid);
$("#mac").html(agentMsg.mac);
},
error: function(err) {
console.log("err"+ err.status)
}
});
}
// Set the rate to poll your imp
setInterval(function(){ poll(); }, pollRate);
function updateToggle(did,_value)
{
var _switch = $(did);
if( _value == "1"){
_switch[0].selectedIndex = 1;
_switch.slider("refresh");
} else {
_switch[0].selectedIndex = 0;
_switch.slider("refresh");
}
}
});
</script>
<style>
@media only screen and (min-width: 321px){
#c1 {width: 390px !important; margin:0 !important; position: relative !important;}
#h1 {width: 420px !important; margin:0 !important; position: relative !important;}
}
.ui-li {list-style-position:inside !important;}
.ui-li h3 {margin:0 0 0 135px; padding:0; width: 50%; }
.ui-li p { padding-top: 20px; border:0px solid blue;}
p.dev { padding-top: 10px; border:0px solid blue;}
p.msg { padding: 0px 0 0 115px; overflow: visible; white-space: pre-wrap; 0}
.ui-li p span{ padding-left: 81px;}
.ui-li-thumb {height:80px !important; left: 140px !important; right : auto; padding:0; opacity:0.6;}
label {display: block; float:left; width:100px; text-align:left; padding-top: 12px; xborder:1px solid red; }
</style>
</head>
<body>
<div data-role="page" id="aprilDigitalIn"><!-- Home -->
<div data-theme="a" data-role="header">
<h3 style="margin-left: 38px; text-align:left"><span style="font-size:0.86em; padding:0 14px 0 0; color:#909090;">T1: April Digital IN</span></h3>
<a href="options.html" data-role="button" data-inline="false" data-icon="gear" data-iconpos="notext" data-iconshadow="false" data-rel="dialog">Agent External URL & PollRate</a>
</div>
<div data-role="content" id="DIN">
<div data-role="fieldcontain" style="width:300px"><!-- Toggle switches -->
<label for="pin1">pin1:</label>
<select id="pin1" data-role="slider">
<option value="off">Off</option>
<option value="on">On</option>
</select>
<div>
<div data-role="fieldcontain" style="width:300px" style="font-size:4.0em;"><!-- Toggle switches -->
<label for="pin2">pin2:</label>
<select id="pin2" data-role="slider" >
<option value="off">Off</option>
<option value="on">On</option>
</select>
</div>
<ul data-role="listview" data-inset="false" id="statusView" data-theme="d" data-divider-theme="d">
<li style="margin:-3px 0 0 -75px; background-color:#F4F5F6; border-top:0px solid #D8D8D8 !important;">
<p class="dev"><strong>rssi&nbsp;&nbsp;</strong><span style="font-weight: bold; font-size:1.2em;" id="rssi"></span></p>
<p style="padding: 0px 0 0 130px; overflow: visible; white-space: pre-wrap;"></p>
<img src="images/wifi_4.png" id="i3" style="padding-left: 4px;" />
</li>
<li style="margin:-3px 0 0 -75px; background-color:#F4F5F6; border-top:0px solid #D8D8D8 !important;">
<p class="dev"><strong>vdd&nbsp;&nbsp;</strong><span style="font-weight: bold; font-size:1.2em;" id="vdd"></span></p>
<p style="padding: 0px 0 0 130px; overflow: visible; white-space: pre-wrap;">&nbsp;</p>
<img src="images/battery_4.png" style="padding-left: 4px;" />
</li>
<li style="margin:-3px 0 0 -75px; background-color:#F4F5F6; border-top:0px solid #D8D8D8 !important;">
<p class="dev"><strong>bssid</strong><span style="font-weight: bold; font-size:1.2em;" id="bssid"></span></p>
<p style="padding: 0px 0 0 130px; overflow: visible; white-space: pre-wrap;"></p>
<img src="images/gen.png" style="padding-left: 4px;" />
</li>
<li style="margin:-3px 0 0 -75px; background-color:#F4F5F6; border-top:0px solid #D8D8D8 !important;">
<p class="dev"><strong>mac&nbsp;&nbsp;</strong><span style="font-weight: bold; font-size:1.2em;" id="mac"></span></p>
<p style="padding: 0px 0 0 130px; overflow: visible; white-space: pre-wrap;">&nbsp;</p>
<img src="images/gen.png" style="padding-left: 4px;" />
</li>
</ul>
</div> <!-- Eof content -->
</div> <!-- Eof JQM page -->
</body>
</html>
<div data-role="page" id="options" data-theme="a">
<div data-theme="a" data-role="header">
<h1 style="color:#cccccc;">Settings</h1>
</div>
<div data-role="content" style="padding: 10px" >
<script type="text/javascript">
$(document).ready(function () {
// Load keys to form
function init() {
if (localStorage["agentURL"]) {
$('#agentURL').val(localStorage["agentURL"]);
}
if (localStorage["pollRate"]) {
$('#pollRate').val(localStorage["pollRate"]);
}
}
init();
// close poup
$("form").submit(function(event) {
event.stopPropagation();
event.preventDefault();
$('.ui-dialog').dialog('close');
});
// Store key values
$('.stored').keyup(function () {
localStorage[$(this).attr('name')] = $(this).val();
});
});
</script>
<form method="get" class="ui-body ui-body-a ui-corner-all">
<fieldset>
<div data-role="fieldcontain">
<label for="agentURL">External URL</label>
<input type="text" name="agentURL" id="agentURL" class="stored" value="" size="20" maxlength="20" />
</div>
<div data-role="fieldcontain">
<label for="pollRate">pollRate</label>
<input type="text" name="pollRate" id="pollRate" class="stored" value="" size="20" maxlength="20" />
</div>
<p>&nbsp;</p>
<button type="submit" data-theme="a" name="submit" value="submit-value" >Save</button>
/fieldset>
</form>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment