Difference between revisions of "Install HTML"
From xPL
(→Install the webSocket libraries) |
(→Install a web server) |
||
| Line 11: | Line 11: | ||
apt-get install php5-cgi | apt-get install php5-cgi | ||
lighttpd-enable-mod fastcgi fastcgi-php | lighttpd-enable-mod fastcgi fastcgi-php | ||
| + | lighty-enable-mod cgi | ||
service lighttpd reload | service lighttpd reload | ||
service lighttpd status | service lighttpd status | ||
| Line 19: | Line 20: | ||
service lighttpd reload | service lighttpd reload | ||
cp /var/www/index.lighttpd.html $WWW_ROOT | cp /var/www/index.lighttpd.html $WWW_ROOT | ||
| + | |||
| + | Edit <code>/etc/lighttpd/conf-enabled/10-cgi.conf</code> to allow CGI script execution: | ||
| + | # /usr/share/doc/lighttpd/cgi.txt | ||
| + | server.modules += ( "mod_cgi" ) | ||
| + | $HTTP["url"] =~ "^/homeControl/" { | ||
| + | cgi.assign = ( ".cgi" => "/usr/bin/perl" ) | ||
| + | } | ||
Navigate to your server within a web browser. | Navigate to your server within a web browser. | ||
Revision as of 13:34, 24 June 2015
Controlling the home from distance is made via a web access.
In this example, the server is harmonia.local: evidently, this has to be replaced by your local server name.
Contents
Install a web server
Install the web server:
su apt-get update apt-get install lighttpd apt-get install php5-cgi lighttpd-enable-mod fastcgi fastcgi-php lighty-enable-mod cgi service lighttpd reload service lighttpd status
Configure the base directory and modify the line with server.document-root:
WWW_ROOT=/mnt/storage/www/ nano /etc/lighttpd/lighttpd.conf service lighttpd reload cp /var/www/index.lighttpd.html $WWW_ROOT
Edit /etc/lighttpd/conf-enabled/10-cgi.conf to allow CGI script execution:
# /usr/share/doc/lighttpd/cgi.txt
server.modules += ( "mod_cgi" )
$HTTP["url"] =~ "^/homeControl/" {
cgi.assign = ( ".cgi" => "/usr/bin/perl" )
}
Navigate to your server within a web browser. You should discover the default lighttpd placeholder page.
Install jQuery
Download the latest compressed, production jQuery version.
wget http://code.jquery.com/jquery-2.1.4.min.js
Prepare a home control page
Create the home control directory:
WWW_CONTROL=$WWW_ROOT/homeControl mkdir -p $WWW_CONTROL chmod -R 775 $WWW_CONTROL chown -R control:users $WWW_CONTROL cd $WWW_CONTROL
In this directory, create a simple.html control page:
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.0.min.js">
</script>
</head>
<body>
<!-- Light controls .................................................... -->
<br />
<table align="center" border='0px' cellpadding='12px' cellspacing='0px' bgcolor="#CCCCCC">
<tr>
<th width="240px">ceiling</th>
<th width="240px">stand</th>
</tr>
<tr>
<td align="center"><input id="ceiling" type="checkbox" /></td>
<td align="center"><input id="stand" type="checkbox" /></td>
</tr>
</table>
<!-- Websocket java script ............................................. -->
<script>
$().ready(function() {
var ws = new WebSocket('ws://harmonia.local:8080/');
ws.onopen = function() {
console.log("Web socket started");
}
// outgoing messages
$('#ceiling').on('change', function() {
ws.send('ceiling ' + $(this).is(':checked'));
});
$('#stand').on('change', function() {
ws.send('stand ' + $(this).is(':checked'));
});
// polling message
window.setInterval(
function() {
ws.send('poll request');
}
, 100
);
// incoming messages
ws.onmessage = function(message) {
console.log(message.data);
var words = message.data.split(' ');
if (words[0] === 'ceiling') {
$('#ceiling').prop('checked', words[1] == 'true');
}
if (words[0] === 'stand') {
$('#stand').prop('checked', words[1] == 'true');
}
}
});
</script>
</body>
</html>
Navigate to the control page: http://harmonia.local/homeControl/simple.html
