diff options
| -rwxr-xr-x | encode_html.sh | 16 | ||||
| -rw-r--r-- | html/index_20120321.html | 67 | ||||
| -rw-r--r-- | html/index_veryold.html | 51 | ||||
| -rw-r--r-- | index.html | 67 |
4 files changed, 201 insertions, 0 deletions
diff --git a/encode_html.sh b/encode_html.sh new file mode 100755 index 0000000..26f6677 --- /dev/null +++ b/encode_html.sh @@ -0,0 +1,16 @@ +#!/bin/sh + +# Copy HTML to a web server.... +scp index.html prometheus.ethernal.org:public_html/arduino.html + +# Fetch HTML with appropriate Accept-Encoding: header -> save to raw file +echo -ne "GET /~mjb/arduino.html HTTP/1.0\nAccept-Encoding: gzip\n\n" | nc www.ethernal.org 80 > index_gzip.raw + +# Process Raw file - delete headers and blank line -> save to raw gzip dat file +sed -e '0,/^\r$/d' index_gzip.raw > index_gzip.dat + +# Process raw gzip dat file into hex array for inclusion in program +od -A n -t x1 index_gzip.dat | sed -e 's/ \(..\)/0x\1, /g' -e 's/^/ /' > index_gzip.txt + +ls -l index_gzip.* + diff --git a/html/index_20120321.html b/html/index_20120321.html new file mode 100644 index 0000000..cde502a --- /dev/null +++ b/html/index_20120321.html @@ -0,0 +1,67 @@ +<html><head><title>Door Control</title> +<meta id='viewport' name='viewport' content='width=160; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;'> +<style> +body {background-color:#bbb;font-family:'Verdana',sans-serif} +h2 {line-height:50%;} +h3 {line-height:5%;} +.page {text-align:center;} +.centred-table,.dobutton {text-align:center;margin-left:auto;margin-right:auto;} +.button {padding-bottom:5px;} +.dobutton {height:50px;width:200px;} +.unlockedlabel,.openlabel,.closedlabel,.statelabel {background-color:#a5a5a5;padding:3px;border-radius:4px;} +.lockedlabel {visibility:hidden;} +.unlockedlabel {background-color:#55f;} +.openlabel {background-color:#f55;} +.closedlabel {background-color:#5f5;} +</style> +<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.min.js'></script> +<script type='text/javascript'> +$(document).ready(function() { + $('#fda').click(function(){$.post('do', {frontdoor: 1});}); + $('#gd1a').click(function(){$.post('do', {garagedoor1: 1});}); + $('#gd2a').click(function(){$.post('do', {garagedoor2: 1});}); + updateStatus(); +}); +function updateStatus() { + $.getJSON('json', function(data) { + $.each(data, function(key, val) { + $('#' + key).attr('class', val + 'label'); + }); + setTimeout(updateStatus, 1000); + }); +} +</script> +</head> +<body> +<div class=page> +<h2>15 Park Lane</h2> +<h3>Door Control</h3> +<table class=centred-table> +<tr> +<td><div id=fdo class=statelabel>Open</div></td> +<td><div id=fdu class=lockedlabel>Unlocked</div></td> +<td><div id=fdc class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton id=fda>Front Door</button></div></td> +</tr> +<tr> +<td><div id=gd1o class=statelabel>Open</div></td> +<td></td> +<td><div id=gd1c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton id=gd1a>Garage Door 1</button></div></td> +</tr> +<tr> +<td><div id=gd2o class=statelabel>Open</div></td> +<td></td> +<td><div id=gd2c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton id=gd2a>Garage Door 2</button></div></td> +</tr> +</table> +</div> +</body> +</html> diff --git a/html/index_veryold.html b/html/index_veryold.html new file mode 100644 index 0000000..ed1b342 --- /dev/null +++ b/html/index_veryold.html @@ -0,0 +1,51 @@ +<html><head><title>Door Control</title> +<meta id='viewport' name='viewport' content='width=160; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;'> +<style type="text/css"> +body {background-color:#bbb} +.page,.middle {text-align:center;} +.centred-table,.dobutton {margin-left:auto;margin-right:auto;} +.left {text-align:left;} +.right {text-align:right;} +.button {padding-bottom:10px;} +.dobutton {height:50px;width:200px;} +.unlockedlabel,.openlabel,.closedlabel,.statelabel {background-color:#a5a5a5;padding:3px;border-radius:4px;} +.unlockedlabel {background-color:#55f;visibility:hidden;} +.openlabel {background-color:#f55;} +.closedlabel {background-color:#5f5;} +</style> +</head> +<body> +<div class=page> +<h1>15 Park Lane</h1> +<h3>Door Control</h3> +<form action='/' method='POST'> +<table class=centred-table> +<tr> +<td class=left><div id=fdo class=statelabel>Open</div></td> +<td class=middle><div id=fdu class=unlockedlabel>Unlocked</div></td> +<td class=right><div id=fdc class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton name='frontdoor' value='1'>Front Door</button></div></td> +</tr> +<tr> +<td class=left><div id=g1o class=statelabel>Open</div></td> +<td class=middle></td> +<td class=right><div id=g1c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton name='garagedoor1' value='1'>Garage Door 1</button></div></td> +</tr> +<tr> +<td class=left><div id=g1o class=statelabel>Open</div></td> +<td class=middle></td> +<td class=right><div id=g1c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><button class=dobutton name='garagedoor2' value='1'>Garage Door 2</button></div></td> +</tr> +</table> +</form> +</div> +</body> +</html> diff --git a/index.html b/index.html new file mode 100644 index 0000000..727b7b3 --- /dev/null +++ b/index.html @@ -0,0 +1,67 @@ +<html><head><title>Door Control</title> +<meta id='viewport' name='viewport' content='width=160; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;'> +<style> +body {background-color:#bbb;font-family:'Verdana',sans-serif} +h2 {line-height:50%;} +h3 {line-height:5%;} +.page {text-align:center;} +.centred-table,.dobutton {text-align:center;margin-left:auto;margin-right:auto;} +.button {padding-bottom:5px;} +.dobutton {height:50px;width:200px;} +.unlockedlabel,.openlabel,.closedlabel,.statelabel {background-color:#a5a5a5;padding:3px;border-radius:4px;} +.lockedlabel {visibility:hidden;} +.unlockedlabel {background-color:#55f;} +.openlabel {background-color:#f55;} +.closedlabel {background-color:#5f5;} +</style> +<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.min.js'></script> +<script type='text/javascript'> +$(document).ready(function() { + $('#fda').click(function(){$.post('do', {frontdoor: 1});}); + $('#gd1a').click(function(){$.post('do', {garagedoor1: 1});}); + $('#gd2a').click(function(){$.post('do', {garagedoor2: 1});}); + updateStatus(); +}); +function updateStatus() { + $.getJSON('json', function(data) { + $.each(data, function(key, val) { + $('#' + key).attr('class', val + 'label'); + }); + setTimeout(updateStatus, 1000); + }); +} +</script> +</head> +<body> +<div class=page> +<h2>15 Park Lane</h2> +<h3>Door Control</h3> +<table class=centred-table> +<tr> +<td><div id=fdo class=statelabel>Open</div></td> +<td><div id=fdu class=lockedlabel>Unlocked</div></td> +<td><div id=fdc class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><input type=button class=dobutton id=fda value='Front Door' /></div></td> +</tr> +<tr> +<td><div id=gd1o class=statelabel>Open</div></td> +<td></td> +<td><div id=gd1c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><input type=button class=dobutton id=gd1a value='Garage Door 1' /></div></td> +</tr> +<tr> +<td><div id=gd2o class=statelabel>Open</div></td> +<td></td> +<td><div id=gd2c class=statelabel>Closed</div></td> +</tr> +<tr> +<td colspan=3><div class=button><input type=button class=dobutton id=gd2a value='Garage Door 2' /></div></td> +</tr> +</table> +</div> +</body> +</html> |