Post by Minas on Apr 15, 2014 3:02:28 GMT
i have done the index.html as in this video and i have connected 8 channel module relay, my problem is that when i use sudo webiopi the relay starts immediately, in other words it starts when i open the webpage. i dont want that, i want to turn on the lights using the button...
www.youtube.com/watch?v=6RaBz01pi4E
thats how my index.html looks like...
www.youtube.com/watch?v=6RaBz01pi4E
thats how my index.html looks like...
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content = "height = device-height, width = 420, user-scalable = no" />
<title>Έλεγχος σπιτιού</title>
<script type="text/javascript" src="/webiopi.js"></script>
<script type="text/javascript">
webiopi().ready(function() {
webiopi().setFunction(7,"out");
var content, button;
content = $("#content");
button = webiopi().createGPIOButton(7,"Δωμάτιο 1");
content.append(button);
webiopi().setFunction(8,"out");
button = webiopi().createGPIOButton(8,"Δωμάτιο 2");
content.append(button);
webiopi().setFunction(25,"out");
button = webiopi().createGPIOButton(25,"Δωμάτιο 3");
content.append(button);
webiopi().setFunction(24,"out");
button = webiopi().createGPIOButton(24,"Σαλόνι");
content.append(button);
webiopi().setFunction(23,"out");
button = webiopi().createGPIOButton(23,"Κουζίνα");
content.append(button);
webiopi().setFunction(18,"out");
button = webiopi().createGPIOButton(18,"Τουαλέτα");
content.append(button);
webiopi().refreshGPIO(true);
});
</script>
<style type="text/css">
button {
display: block;
margin: 5px 5px 5px 5px;
width: 230px;
height: 65px;
font-size: 24pt;
font-weight: bold;
color: black;
}
input[type="range"] {
display: block;
width: 160px;
height: 45px;
}
#gpio7.LOW {
background-color: Grey;
}
#gpio7.HIGH {
background-color: Red;
}
#gpio8.LOW {
background-color: Grey;
}
#gpio8.HIGH {
background-color: Red;
}
#gpio25.LOW {
background-color: Grey;
}
#gpio25.HIGH {
background-color: Red;
}
#gpio24.LOW {
background-color: Grey;
}
#gpio24.HIGH {
background-color: Red;
}
#gpio23.LOW {
background-color: Grey;
}
#gpio23.HIGH {
background-color: Red;
}
#gpio18.LOW {
background-color: Grey;
}
#gpio18.HIGH {
background-color: Red;
}
</style>
</head>
<body>
<div id="content" align="left"></div>
</body>
</html>