Created
September 25, 2013 12:31
-
-
Save matbor/6698980 to your computer and use it in GitHub Desktop.
Steelseries gauge displaying temperature live using websockets from a mqtt/mosquitto broker.
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
<head> | |
<title>Testing Temp Gauge</title> | |
</head> | |
<body onload="init();"> | |
<canvas id=gaugeCanvas width=200 height=200>No canvas in your browser...sorry...</canvas> | |
</body> | |
<script type="text/javascript" src="mosquitto-1.1.js"></script> | |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> | |
<script type=text/javascript src=http://dl.dropbox.com/u/128855213/SteelSeries/tween-min.js></script> | |
<script type=text/javascript src=http://dl.dropbox.com/u/128855213/SteelSeries/steelseries-min.js></script> | |
<script> | |
var tempGauge; | |
var mosq = new Mosquitto(); | |
function init() | |
{ // from @bordignons Sep 2013 | |
// original idea.. http://www.desert-home.com/2013/06/how-to-use-steelseries-gauges-with.html | |
// with help.. http://harmoniccode.blogspot.com.au/ | |
// and code.. https://github.com/HanSolo/SteelSeries-Canvas | |
// Initialzing gauge | |
tempGauge = new steelseries.Radial('gaugeCanvas', { | |
gaugeType: steelseries.GaugeType.TYPE4, | |
minValue:-15, | |
maxValue:50, | |
size: 400, | |
frameDesign: steelseries.FrameDesign.BRASS, | |
knobStyle: steelseries.KnobStyle.BRASS, | |
pointerType: steelseries.PointerType.TYPE6, | |
lcdDecimals: 0, | |
section: null, | |
area: null, | |
titleString: 'Outside Temp', | |
unitString: 'C', | |
threshold: 100, | |
lcdVisible: true, | |
lcdDecimals: 2 | |
}); | |
tempGauge.setValue(''); | |
} | |
mosq.onmessage = onMessage; | |
mosq.ondisconnect = onDisconnect; | |
mosq.onconnect = function(rc) { | |
//console.log("mqtt connected"); | |
//add your topic that you want to subscribe to here, currently set to all topics # | |
mosq.subscribe('#', 0); | |
}; | |
//var url = 'ws://test.mosquitto.org/mqtt'; | |
var url = 'ws://' + location.host + ":" + location.port + '/mqtt'; | |
//console.log(url); | |
mosq.connect(url); | |
function onMessage(topic, payload, qos) { | |
//console.log(topic + " - " + payload); | |
tempGauge.setValue(payload); | |
} | |
function onDisconnect(reason) { | |
//console.log("disconnected"); | |
alert("disconnected"); | |
} | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment