-
-
Save shubham0704/f9523e9a5192813ba0b2ba9846bc1792 to your computer and use it in GitHub Desktop.
A Simple Web Socket Demo that displays current temperature from a Raspberry pi's GPIO pins using a temperature sensor. Needs: Rashberry Pi, temperature probe, python 2.7, Tornado Webserver
1) Read This: http://www.cl.cam.ac.uk/projects/raspberrypi/tutorials/temperature/
2) Install tornado Webserver
3) Change the ws address in html file to the lo…
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import time | |
import tornado.httpserver | |
import tornado.websocket | |
import tornado.ioloop | |
from tornado.ioloop import PeriodicCallback | |
import tornado.web | |
class WSHandler(tornado.websocket.WebSocketHandler): | |
def open(self): | |
self.callback = PeriodicCallback(self.send_temp, 120) | |
self.callback.start() | |
def send_hello(self): | |
self.write_message('hello') | |
def on_message(self, message): | |
pass | |
def on_close(self): | |
self.callback.stop() | |
print "Closed Connection" | |
def send_temp(self): | |
#Change this to the file of your temp probe! | |
tfile = open("/sys/bus/w1/devices/28-000004acc08b/w1_slave") | |
text = tfile.read() | |
tfile.close() | |
temperaturedata = text.split("\n")[1].split(" ")[9] | |
temperature = float(temperaturedata[2:]) | |
temperature = temperature / 1000 * 9 / 5 + 32 | |
self.write_message("Current Temperature: {0:.2f}F".format(temperature)) | |
print temperature | |
time.sleep(1) | |
application = tornado.web.Application([(r'/', WSHandler),]) | |
if __name__ == "__main__": | |
http_server = tornado.httpserver.HTTPServer(application) | |
http_server.listen(9999) | |
tornado.ioloop.IOLoop.instance().start() | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
/* | |
* ---------------------------------------------------------------------------- | |
* "THE BEER-WARE LICENSE" (Revision 42): | |
* <[email protected]> wrote this file. As long as you retain this notice you | |
* can do whatever you want with this stuff. If we meet some day, and you think | |
* this stuff is worth it, you can buy me a beer in return Joseph Livecchi | |
* ---------------------------------------------------------------------------- | |
*/ | |
--> | |
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, user-scalable=no" /> | |
<title>BlenderWebController</title> | |
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script> | |
<script type="text/javascript" src="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script> | |
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" type="text/css" /> | |
<script> | |
//Change this to the locla ip of your pi | |
var address = "ws://192.168.1.200:9999/" | |
$(document).ready(function(){ | |
try { | |
var s = new WebSocket(address); | |
s.onopen = function (e) { | |
$("#Status").slideUp(); | |
}; | |
s.onclose = function (e) { | |
$("#Status > div > p").text("Not Connected"); | |
$("#Status").slideDown(); | |
}; | |
s.onmessage = function (e) { | |
$("#templog > li").removeClass("hightlight"); | |
$("#templog").prepend('<li class="list-group-item hightlight"></li>'); | |
$("#templog > li").first() | |
.hide() | |
.text( e.data + ' @ ' + (new Date()).toLocaleTimeString() ) | |
.slideDown("slow"); | |
}; | |
s.onerror = function (e) { | |
$("#Status > div > p").text("Something Died!"); | |
$("#Status").slideDown(); | |
}; | |
} catch (ex) { | |
$("#Status > div > p").text("Something Died!"); | |
$("#Status").slideDown(); | |
} | |
$("#close").click( function () { | |
s.close(1000, "Try to Close"); | |
}); | |
}); | |
</script> | |
<style> | |
.hightlight{ | |
font-size: 2em; | |
font-weight: bold; | |
color: rgb(138, 109, 59); | |
background-color: rgb(252, 248, 227); | |
border-color: rgb(250, 235, 204); | |
} | |
</style> | |
</head> | |
<body> | |
<div class="container"> | |
<div class="row" id="Status"> | |
<div class="alert alert-warning"> | |
<strong>Warning</strong><p></p> | |
</div> | |
</div> | |
<div class="row"> | |
<div class="panel panel-primary"> | |
<div class="panel-heading" > | |
<h2 class="panel-title" style="display:inline;font-size:160%;" >Temperature Log</h2> | |
<button class="btn btn-warning" type="button" id="close" style="display:inline;float:right;">Close</button> | |
</div> | |
<div class="panel-body"> | |
<ul id="templog" class="list-group"> | |
</ul> | |
</div> | |
</div> | |
</div> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment