Last active
December 21, 2015 06:18
-
-
Save industrialinternet/6262728 to your computer and use it in GitHub Desktop.
Web sliders
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//T5 Analog Outputs | |
const ON=1 | |
const OFF=0 | |
// 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("T5 Analog Outputs",[],[]); | |
server.log("T5_Analog_Outputs - v1.0"); | |
agent.on("setValues", function(agentMSG) { | |
local val = agentMSG.sliderVal.tofloat()/100; | |
if(agentMSG.sliderID =="slider1"){ | |
server.log("slider1:"+val); | |
Pins[0].write(val); | |
} else if (agentMSG.sliderID =="slider2"){ | |
server.log("slider2:"+val); | |
Pins[2].write(val); | |
} else if (agentMSG.sliderID =="slider3"){ | |
server.log("slider3:"+val); | |
// Only 2 DACs on an imp01 | |
} | |
}); | |
// Configure output pins | |
Pins[0].configure(ANALOG_OUT); | |
Pins[0].write(0); | |
Pins[2].configure(ANALOG_OUT); | |
Pins[2].write(0); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Set slider valves | |
server.log("T5 Analog Outputs v1.1"); | |
function requestHandler(request,res){ | |
server.log("reqMethod:"+request.method); | |
res.header("Access-Control-Allow-Origin", "*"); | |
if(request.method=="OPTIONS"){ | |
res.header("Access-Control-Allow-Methods", "POST, GET, OPTIONS"); | |
res.header("Access-Control-Allow-Headers", "origin, x-csrftoken, content-type, accept"); | |
res.send(200,"OK.OPTIONS"); | |
} | |
if(request.method=="POST"){ | |
local settings = http.jsondecode(request.body); | |
server.log(settings.sliderID+","+settings.sliderVal); | |
if("sliderID" in settings && "sliderVal" in settings){ | |
device.send("setValues",settings); | |
res.header("AgentResponce", "Settings_OK"); | |
} else { | |
res.header("AgentResponce", "Settings_Error"); | |
} | |
res.header("Access-Control-Expose-Headers", "AgentResponce"); | |
res.send(200,"OK.POST"); | |
} else { | |
res.header("Access-Control-Expose-Headers", "AgentResponce"); | |
res.send(400,"Error.POST"); | |
} | |
} | |
http.onrequest(requestHandler); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!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>T5 Analog Outputs</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() { | |
// Get the Agent external URl from HTML5 local storage | |
var externalURL =""; | |
if (localStorage["agentURL"]) { | |
externalURL=localStorage["agentURL"]; | |
} | |
$(".ui-slider").on("slidestop", function (event) { | |
console.log("id:"+event.target.id+" value: " + event.target.value); | |
impSetValue(event.target.id,event.target.value); | |
}); | |
function impSetValue(_sliderID,_slider_value){ | |
// Build the json | |
var objs = {"sliderID": _sliderID , "sliderVal":_slider_value}; | |
agentActions = JSON.stringify(objs); | |
console.log("agentActions:"+ agentActions); | |
// POST to Agent | |
$.ajax({ | |
type: "POST", | |
url: "https://agent.electricimp.com/"+externalURL, | |
data: agentActions, | |
contentType: "application/json; charset=utf-8", | |
dataType: "json", | |
complete: function(jqXHR, textStatus){ | |
_header= jqXHR.getResponseHeader("AgentResponce"); | |
console.log("textStatus: "+jqXHR.responseText+" AgentResponce:"+_header); | |
} | |
}); | |
} | |
}); | |
</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="sliders"><!-- 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;">T5 Analog Outputs</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</a> | |
</div> | |
<div data-role="content" id="sliders"> | |
<div data-role="fieldcontain" style="xwidth:470px; xborder:1px solid red; " id="foooo"> | |
<fieldset data-role="controlgroup" id="fs1"> | |
<label for="slider1">Pin1</label> | |
<input type="range" name="slider1" id="slider1" value="0" min="0" max="100" data-highlight="false" data-theme="c" step="1" data-type="range" /> <br /> | |
<label for="slider2">Pin5</label> | |
<input type="range" name="slider2" id="slider2" value="0" min="0" max="100" data-highlight="false" data-theme="c" step="1" /> <br /> | |
<label for="slider3">Anything</label> | |
<input type="range" name="slider3" id="slider3" value="0" min="0" max="100" data-highlight="false" data-theme="c" step="1" /> <br /> | |
</fieldset> | |
</div> | |
</div> <!-- Eof content --> | |
</div> <!-- Eof JQM page --> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment