Mercurial > mbsePi-apps / changeset
changeset
Added room temperature and humidity to the web interface
Sun, 10 Aug 2014 16:56:22 +0200
- author
- Michiel Broek <mbroek@mbse.eu>
- date
- Sun, 10 Aug 2014 16:56:22 +0200
- changeset 208
- 934d45d9751d
- parent 207
- 8d2ba4126519
- child 209
- c5b1dfd83e81
Added room temperature and humidity to the web interface
--- a/thermferm/server.c Sun Aug 10 16:17:03 2014 +0200 +++ b/thermferm/server.c Sun Aug 10 16:56:22 2014 +0200 @@ -452,10 +452,10 @@ srv_send((char *)"TEMPFORMAT,%c", Config.tempFormat); srv_send((char *)"TEMP_ADDRESS,%s", Config.temp_address); srv_send((char *)"TEMP_STATE,%s", TEMPSTATE[Config.temp_state]); - srv_send((char *)"TEMP_VALUE,%.3f", Config.temp_value / 1000.0); + srv_send((char *)"TEMP_VALUE,%.1f", Config.temp_value / 1000.0); srv_send((char *)"HUM_ADDRESS,%s", Config.hum_address); srv_send((char *)"HUM_STATE,%s", TEMPSTATE[Config.hum_state]); - srv_send((char *)"HUM_VALUE,%.3f", Config.hum_value / 1000.0); + srv_send((char *)"HUM_VALUE,%.0f", Config.hum_value / 1000.0); #ifdef HAVE_WIRINGPI_H srv_send((char *)"LCD_COLS,%d", Config.lcd_cols); srv_send((char *)"LCD_ROWS,%d", Config.lcd_rows);
--- a/www-thermferm/css/style.css Sun Aug 10 16:17:03 2014 +0200 +++ b/www-thermferm/css/style.css Sun Aug 10 16:56:22 2014 +0200 @@ -46,6 +46,29 @@ font-weight: bold; } +#title { + width: 500px; + height: 50px; + float: left; +} + +#room { + width: 100px; + height: 48px; + float: left; + border-radius: 5px 5px 5px 5px; + background-color: #222; + text-align: center; + margin-top: 15px; +} + +.rtemp { + font-weight: bold; + font-size: 1.2em; + color: yellow; + margin-top: 3px; +} + #content { width: 978px; height: 428px;
--- a/www-thermferm/getroom.php Sun Aug 10 16:17:03 2014 +0200 +++ b/www-thermferm/getroom.php Sun Aug 10 16:56:22 2014 +0200 @@ -42,11 +42,11 @@ if ($f[0] == "TEMP_STATE") $temp_state = $f[1]; if (($f[0] == "TEMP_VALUE") && ($temp_state == "OK")) - $temp_value = $f[1]; + $temp_value = $f[1].' °C'; if ($f[0] == "HUM_STATE") $hum_state = $f[1]; if (($f[0] == "HUM_VALUE") && ($hum_state == "OK")) - $hum_value = $f[1]; + $hum_value = $f[1].' %'; $j++; } }
--- a/www-thermferm/index.php Sun Aug 10 16:17:03 2014 +0200 +++ b/www-thermferm/index.php Sun Aug 10 16:56:22 2014 +0200 @@ -193,6 +193,9 @@ } +$temp_value = "NA"; +$hum_value = "NA"; + $outstr = '<!DOCTYPE html>'.PHP_EOL; $outstr .= '<html>'.PHP_EOL; $outstr .= ' <head>'.PHP_EOL; @@ -216,6 +219,13 @@ $outstr .= ' <body class="default">'.PHP_EOL; $outstr .= ' <div id="jqxWidget">'.PHP_EOL; $outstr .= ' <div id="header">'.PHP_EOL; +$outstr .= ' <div id="title">'.PHP_EOL; +$outstr .= ' ThermFerm'.PHP_EOL; +$outstr .= ' </div>'.PHP_EOL; +$outstr .= ' <div id="room">'.PHP_EOL; +$outstr .= ' <div id="room_temp" class="rtemp">'.$temp_value.'</div>'.PHP_EOL; +$outstr .= ' <div id="room_hum" class="rtemp">'.$hum_value.'</div>'.PHP_EOL; +$outstr .= ' </div>'.PHP_EOL; $outstr .= ' <form action="maintenance.php" style="margin:30px; float:right">'.PHP_EOL; $outstr .= ' <input type="submit" id="maintenance" value="Maintenance panel" />'.PHP_EOL; $outstr .= ' </form>'.PHP_EOL;
--- a/www-thermferm/js/index.js Sun Aug 10 16:17:03 2014 +0200 +++ b/www-thermferm/js/index.js Sun Aug 10 16:56:22 2014 +0200 @@ -22,6 +22,12 @@ $(document).ready(function () { + setInterval(function(){ + $.getJSON("getroom.php", function(data) { + $("#room_temp").html(data.temperature); + $("#room_hum").html(data.humidity); + }); + }, 10000); // Create jqxTabs. $("#jqxTabs").jqxTabs({ width: 978, height: 428, position: 'top', theme: 'ui-redmond'}); $("#maintenance").jqxButton({ width: 150, height: 25, theme: 'ui-redmond' });
