enque
August 17, 2013, 7:09am
1
Hey, not sure if this is the proper place for this, but basically I want to do a few smallish projects that can become a cut and paste web interface in the future. To begin with I want to have a website with a slider on it, then pass the data to the imp to control a value. I am using the “Imp tutorials for Makers” by @controlCloud as inspiration. It would be really nice to have a jquery slider or similar. Still a newb at imp code, and especially at web stuff, but i do have hosting and am in the agents beta. Can anyone give me some advice on how to get started?
@enque web slides should work any issues PM me if doesn’t
T5_Analog_Outputs_01_Imp.js
//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 impshow original
T5_Analog_Outputs_02_Agent.js
//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");show original
T5_Analog_Outputs_03_webApp.html
<!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>show original
T5_Analog_Outputs_01_Imp.js
//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 impshow original
T5_Analog_Outputs_02_Agent.js
//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");show original
T5_Analog_Outputs_03_webApp.html
<!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>show original
http://industrialinternet.co.uk/eimp/sliders/
enque
August 24, 2013, 9:05pm
3
Thank you very much @controlCloud . I have been working 12s, so I havent had a chance to try it yet.
All I need to use this is to replace the ExternalURL with mine?
@sbrigt33 yes just replace external URL the last part e.g agent I’d
I didn’t even think of that! Easy to test.
enque
September 10, 2013, 7:54pm
7
Hey @controlCloud . Thanks again for the help. I am trying to adapt this, but I am stuck on the imp code in order to do something with the slider value.
@enque have updated agent and web app also added imp code which writes 2 sliders to analog outputs pins
Agent
T5_Analog_Outputs_01_Imp.js
//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 impshow original
T5_Analog_Outputs_02_Agent.js
//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");show original
T5_Analog_Outputs_03_webApp.html
<!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>show original
T5_Analog_Outputs_01_Imp.js
//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 impshow original
T5_Analog_Outputs_02_Agent.js
//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");show original
T5_Analog_Outputs_03_webApp.html
<!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>show original
enque
October 20, 2013, 5:35pm
9
Thank you again @controlCloud . Is there a way to do this same thing without pulling the position of the sliders off an external website. Can it be done within the agent using basic html? (similar to the snackbot http://www.instructables.com/id/SnackBot-The-Internet-Connected-Candy-Machine/ )
@enque it should be but sorry to say it’s not something I can help with at the moment.