Important changes to repositories hosted on mbed.com
Mbed hosted mercurial repositories are deprecated and are due to be permanently deleted in July 2026.
To keep a copy of this software download the repository Zip archive or clone locally using Mercurial.
It is also possible to export all your personal repositories from the account settings page.
Dependencies: C12832_lcd EthernetInterface LM75B MMA7660 WebSocketClient mbed-rpc mbed-rtos mbed
viewer
viewer.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<script>
var channel = "appboard-rpc";
var url = "ws://sockets.mbed.org/ws/" + channel + "/rw";
$('#top').live('pageinit', function(e, d) {
var ws = new WebSocket("ws://sockets.mbed.org/ws/" + channel + "/rw");
var img_str = "";
var frame = 0;
ws.onopen = function(evt) {
$("#status").text("CONNECTED")
};
ws.onclose = function(evt) {
$("#status").text("DISCONNECTED")
};
ws.onmessage = function(evt) {
var s = evt.data;
console.log(s);
obj = JSON.parse(s);
if ("pot1" in obj) {
$("#pot1").text(obj.pot1);
}
if ("pot2" in obj) {
$("#pot2").text(obj.pot2);
}
}
var pre_red = 1.0;
$("#red_per").bind("change", function(evt) {
var red = $("#red_per").val();
if (pre_red != red) {
pre_red = red;
var s = "/Red/write " + red;
console.log(s);
ws.send(s);
}
});
var pre_green = 1.0;
$("#green_per").bind("change", function(evt) {
var green = $("#green_per").val();
if (pre_green != green) {
pre_green = green;
var s = "/Green/write " + green;
console.log(s);
ws.send(s);
}
});
var pre_blue = 1.0;
$("#blue_per").bind("change", function(evt) {
var blue = $("#blue_per").val();
if (pre_blue != blue) {
pre_blue = blue;
var s = "/Blue/write " + blue;
console.log(s);
ws.send(s);
}
});
});
</script>
</head>
<body>
<div data-role="page" id="top">
<div data-role="header" data-theme="b">
<h1>app-board</h1>
</div>
<div data-role="content">
<form>
<div data-role="fieldcontain">
<label for="red_per">Red:</label><br />
<input id="red_per" name="red_per"
type="range" min="0.0" max="1.0" step="0.05" value="1.0" data-highlight="true" />
</div>
<div data-role="fieldcontain">
<label for="green_per">Green:</label><br />
<input id="green_per" name="green_per"
type="range" min="0.0" max="1.0" step="0.05" value="1.0" data-highlight="true" />
</div>
<div data-role="fieldcontain">
<label for="blue_per">Blue:</label><br />
<input id="blue_per" name="blue_per"
type="range" min="0.0" max="1.0" step="0.05" value="1.0" data-highlight="true" />
</div>
</form>
<div>
pot1:<span id="pot1"></span><br>
pot2:<span id="pot2"></span><br>
</div>
</div>
<div data-role="footer" data-theme="b">
<h4 id="status"></h4>
</div>
</div>
</body>
</html>