Example showing the ublox Cellular GPS/GNSS module with the online PubNub service on an LPC4088 Experiment Base Board. This example uses an RTOS.
Dependencies: C027_Support EALib LM75B PubNub mbed-rtos mbed picojson
pubnub_acc.html@0:713518ea5028, 2014-10-01 (annotated)
- Committer:
- embeddedartists
- Date:
- Wed Oct 01 11:39:10 2014 +0000
- Revision:
- 0:713518ea5028
First version
Who changed what in which revision?
User | Revision | Line number | New contents of line |
---|---|---|---|
embeddedartists | 0:713518ea5028 | 1 | <html> |
embeddedartists | 0:713518ea5028 | 2 | <head> |
embeddedartists | 0:713518ea5028 | 3 | <!-- <script type="text/javascript" src="jscolor/jscolor.js"></script>--> |
embeddedartists | 0:713518ea5028 | 4 | <script type="text/javascript" src="https://www.google.com/jsapi"></script> |
embeddedartists | 0:713518ea5028 | 5 | <script type="text/javascript"> |
embeddedartists | 0:713518ea5028 | 6 | var baseline = Math.round(new Date().getTime()/10); // current time as integer in 10ms resolution |
embeddedartists | 0:713518ea5028 | 7 | var temps = [['Time', 'Temp']]; |
embeddedartists | 0:713518ea5028 | 8 | var accs = [['Time', 'X', 'Y', 'Z']]; |
embeddedartists | 0:713518ea5028 | 9 | google.load("visualization", "1", {packages:["corechart"]}); |
embeddedartists | 0:713518ea5028 | 10 | //google.setOnLoadCallback(drawChart); |
embeddedartists | 0:713518ea5028 | 11 | function drawChart() { |
embeddedartists | 0:713518ea5028 | 12 | /*var data = google.visualization.arrayToDataTable([ |
embeddedartists | 0:713518ea5028 | 13 | ['Year', 'Sales', 'Expenses'], |
embeddedartists | 0:713518ea5028 | 14 | ['2004', 1000, 400], |
embeddedartists | 0:713518ea5028 | 15 | ['2005', 1170, 460], |
embeddedartists | 0:713518ea5028 | 16 | ['2006', 660, 1120], |
embeddedartists | 0:713518ea5028 | 17 | ['2007', 1030, 540] |
embeddedartists | 0:713518ea5028 | 18 | ]);*/ |
embeddedartists | 0:713518ea5028 | 19 | var data = google.visualization.arrayToDataTable(temps); |
embeddedartists | 0:713518ea5028 | 20 | |
embeddedartists | 0:713518ea5028 | 21 | var options = { |
embeddedartists | 0:713518ea5028 | 22 | title: 'Temperature over time', |
embeddedartists | 0:713518ea5028 | 23 | vAxis: { title: "Degrees C" }, |
embeddedartists | 0:713518ea5028 | 24 | hAxis: { title: "Time since first message (in seconds)" }, |
embeddedartists | 0:713518ea5028 | 25 | curveType: 'function', |
embeddedartists | 0:713518ea5028 | 26 | legend: { position: 'none' }, |
embeddedartists | 0:713518ea5028 | 27 | }; |
embeddedartists | 0:713518ea5028 | 28 | |
embeddedartists | 0:713518ea5028 | 29 | var chart = new google.visualization.LineChart(document.getElementById('chart_div')); |
embeddedartists | 0:713518ea5028 | 30 | |
embeddedartists | 0:713518ea5028 | 31 | chart.draw(data, options); |
embeddedartists | 0:713518ea5028 | 32 | |
embeddedartists | 0:713518ea5028 | 33 | // Acc chart |
embeddedartists | 0:713518ea5028 | 34 | var data = google.visualization.arrayToDataTable(accs); |
embeddedartists | 0:713518ea5028 | 35 | |
embeddedartists | 0:713518ea5028 | 36 | var options = { |
embeddedartists | 0:713518ea5028 | 37 | title: 'Acceleration over time', |
embeddedartists | 0:713518ea5028 | 38 | vAxis: { title: "Acc value", minValue: -60, maxValue: 60 }, |
embeddedartists | 0:713518ea5028 | 39 | hAxis: { title: "Time since first message (in seconds)" }, |
embeddedartists | 0:713518ea5028 | 40 | curveType: 'function', |
embeddedartists | 0:713518ea5028 | 41 | //legend: { position: 'none' }, |
embeddedartists | 0:713518ea5028 | 42 | }; |
embeddedartists | 0:713518ea5028 | 43 | |
embeddedartists | 0:713518ea5028 | 44 | var chart = new google.visualization.LineChart(document.getElementById('acc_chart_div')); |
embeddedartists | 0:713518ea5028 | 45 | |
embeddedartists | 0:713518ea5028 | 46 | chart.draw(data, options); |
embeddedartists | 0:713518ea5028 | 47 | } |
embeddedartists | 0:713518ea5028 | 48 | function addToChart(t, x, y, z) { |
embeddedartists | 0:713518ea5028 | 49 | var now = Math.round(new Date().getTime()/10); // current time as integer in 10ms resolution |
embeddedartists | 0:713518ea5028 | 50 | console.log(new Date().getTime()/10 + " " + (now - baseline) + " temp = " + t+ " acc {"+x+","+y+","+z+"}"); |
embeddedartists | 0:713518ea5028 | 51 | temps[temps.length] = [ (now - baseline)/100, t ]; |
embeddedartists | 0:713518ea5028 | 52 | accs[accs.length] = [ (now - baseline)/100, x, y, z]; |
embeddedartists | 0:713518ea5028 | 53 | drawChart(); |
embeddedartists | 0:713518ea5028 | 54 | } |
embeddedartists | 0:713518ea5028 | 55 | </script> |
embeddedartists | 0:713518ea5028 | 56 | <script src=http://cdn.pubnub.com/pubnub.min.js ></script> |
embeddedartists | 0:713518ea5028 | 57 | <script> |
embeddedartists | 0:713518ea5028 | 58 | var pubnub = PUBNUB.init({ |
embeddedartists | 0:713518ea5028 | 59 | publish_key: 'pub-c-e4a8b6d6-7be2-4ef9-85b9-f6dfbed23f7d', |
embeddedartists | 0:713518ea5028 | 60 | subscribe_key: 'sub-c-83ad9d3a-3365-11e4-9846-02ee2ddab7fe' |
embeddedartists | 0:713518ea5028 | 61 | }); |
embeddedartists | 0:713518ea5028 | 62 | |
embeddedartists | 0:713518ea5028 | 63 | function receiveMessage(message) { |
embeddedartists | 0:713518ea5028 | 64 | //console.log(message); |
embeddedartists | 0:713518ea5028 | 65 | |
embeddedartists | 0:713518ea5028 | 66 | var type = 0; |
embeddedartists | 0:713518ea5028 | 67 | try { |
embeddedartists | 0:713518ea5028 | 68 | var test = message.status.mx; |
embeddedartists | 0:713518ea5028 | 69 | type = 1; |
embeddedartists | 0:713518ea5028 | 70 | } catch (err) { |
embeddedartists | 0:713518ea5028 | 71 | // not a measurement status message from HW |
embeddedartists | 0:713518ea5028 | 72 | } |
embeddedartists | 0:713518ea5028 | 73 | try { |
embeddedartists | 0:713518ea5028 | 74 | var test = message.led.r; |
embeddedartists | 0:713518ea5028 | 75 | type = 2; |
embeddedartists | 0:713518ea5028 | 76 | } catch (err) { |
embeddedartists | 0:713518ea5028 | 77 | // not a set RGB color request from us |
embeddedartists | 0:713518ea5028 | 78 | } |
embeddedartists | 0:713518ea5028 | 79 | |
embeddedartists | 0:713518ea5028 | 80 | var messageLog = document.getElementById("messageLog"); |
embeddedartists | 0:713518ea5028 | 81 | if (type == 1) { |
embeddedartists | 0:713518ea5028 | 82 | var listItem = document.createElement("li"); |
embeddedartists | 0:713518ea5028 | 83 | var msg = "Acc X,Y,Z = {" + message.status.mx + ", " + message.status.my + ", " + message.status.mz + "} Temp = " + message.status.temp; |
embeddedartists | 0:713518ea5028 | 84 | var text = document.createTextNode(msg); |
embeddedartists | 0:713518ea5028 | 85 | listItem.appendChild(text); |
embeddedartists | 0:713518ea5028 | 86 | document.getElementById("messageList").appendChild(listItem); |
embeddedartists | 0:713518ea5028 | 87 | messageLog.scrollTop = messageLog.scrollHeight; |
embeddedartists | 0:713518ea5028 | 88 | addToChart(message.status.temp, message.status.mx, message.status.my, message.status.mz); |
embeddedartists | 0:713518ea5028 | 89 | } else if (type == 2) { |
embeddedartists | 0:713518ea5028 | 90 | var listItem = document.createElement("li"); |
embeddedartists | 0:713518ea5028 | 91 | var msg = "Set RGB LED: {" + message.led.r + ", " + message.led.g + ", " + message.led.b + "}"; |
embeddedartists | 0:713518ea5028 | 92 | var text = document.createTextNode(msg); |
embeddedartists | 0:713518ea5028 | 93 | listItem.appendChild(text); |
embeddedartists | 0:713518ea5028 | 94 | document.getElementById("messageList").appendChild(listItem); |
embeddedartists | 0:713518ea5028 | 95 | messageLog.scrollTop = messageLog.scrollHeight; |
embeddedartists | 0:713518ea5028 | 96 | //addToChart(message.status.temp); |
embeddedartists | 0:713518ea5028 | 97 | } else { |
embeddedartists | 0:713518ea5028 | 98 | // got an error, probably because message is not from mbed |
embeddedartists | 0:713518ea5028 | 99 | var listItem = document.createElement("li"); |
embeddedartists | 0:713518ea5028 | 100 | var msg = "Unknwon RAW message: " + message; |
embeddedartists | 0:713518ea5028 | 101 | var text = document.createTextNode(msg); |
embeddedartists | 0:713518ea5028 | 102 | listItem.appendChild(text); |
embeddedartists | 0:713518ea5028 | 103 | document.getElementById("messageList").appendChild(listItem); |
embeddedartists | 0:713518ea5028 | 104 | messageLog.scrollTop = messageLog.scrollHeight; |
embeddedartists | 0:713518ea5028 | 105 | //addToChart(message.status.temp); |
embeddedartists | 0:713518ea5028 | 106 | } |
embeddedartists | 0:713518ea5028 | 107 | } |
embeddedartists | 0:713518ea5028 | 108 | |
embeddedartists | 0:713518ea5028 | 109 | /*function sendMessage(newcolor) { |
embeddedartists | 0:713518ea5028 | 110 | //var r = parseInt(newcolor.substr(0,2), 16)/255; |
embeddedartists | 0:713518ea5028 | 111 | //var g = parseInt(newcolor.substr(2,2), 16)/255; |
embeddedartists | 0:713518ea5028 | 112 | //var b = parseInt(newcolor.substr(4,2), 16)/255; |
embeddedartists | 0:713518ea5028 | 113 | //var msg = '{ "led": {"r": ' + r + ', "g": ' + g + ', "b": ' + b + '} }'; |
embeddedartists | 0:713518ea5028 | 114 | //var msg = '{ "led": {"r": ' + newcolor.rgb[0] + ', "g": ' + newcolor.rgb[1] + ', "b": ' + newcolor.rgb[2] + '} }'; |
embeddedartists | 0:713518ea5028 | 115 | var msg = { "led": {"r": newcolor.rgb[0], "g": newcolor.rgb[1], "b": newcolor.rgb[2]} }; |
embeddedartists | 0:713518ea5028 | 116 | console.log("new color #" + newcolor + " => message " + msg.led.r+","+msg.led.g+","+msg.led.b); |
embeddedartists | 0:713518ea5028 | 117 | pubnub.publish({ |
embeddedartists | 0:713518ea5028 | 118 | channel: 'mbed_cmd',//'hello_world', |
embeddedartists | 0:713518ea5028 | 119 | message: msg |
embeddedartists | 0:713518ea5028 | 120 | }); |
embeddedartists | 0:713518ea5028 | 121 | }*/ |
embeddedartists | 0:713518ea5028 | 122 | function sendColorMessage(r,g,b) { |
embeddedartists | 0:713518ea5028 | 123 | var msg = { "led": {"r": r, "g": g, "b": b} }; |
embeddedartists | 0:713518ea5028 | 124 | console.log("message " + msg.led.r+","+msg.led.g+","+msg.led.b); |
embeddedartists | 0:713518ea5028 | 125 | pubnub.publish({ |
embeddedartists | 0:713518ea5028 | 126 | channel: 'mbed_cmd',//'hello_world', |
embeddedartists | 0:713518ea5028 | 127 | message: msg |
embeddedartists | 0:713518ea5028 | 128 | }); |
embeddedartists | 0:713518ea5028 | 129 | } |
embeddedartists | 0:713518ea5028 | 130 | |
embeddedartists | 0:713518ea5028 | 131 | pubnub.subscribe({ |
embeddedartists | 0:713518ea5028 | 132 | channel: 'mbed_data',//'hello_world', |
embeddedartists | 0:713518ea5028 | 133 | message: receiveMessage |
embeddedartists | 0:713518ea5028 | 134 | }); |
embeddedartists | 0:713518ea5028 | 135 | |
embeddedartists | 0:713518ea5028 | 136 | /* pubnub.unsubscribe({ |
embeddedartists | 0:713518ea5028 | 137 | channel: 'a', |
embeddedartists | 0:713518ea5028 | 138 | message: function(m){console.log(m)} |
embeddedartists | 0:713518ea5028 | 139 | });*/ |
embeddedartists | 0:713518ea5028 | 140 | </script> |
embeddedartists | 0:713518ea5028 | 141 | <style> |
embeddedartists | 0:713518ea5028 | 142 | li { font-style: monospace; } |
embeddedartists | 0:713518ea5028 | 143 | table,tr {border: none; } |
embeddedartists | 0:713518ea5028 | 144 | </style> |
embeddedartists | 0:713518ea5028 | 145 | </head> |
embeddedartists | 0:713518ea5028 | 146 | <body> |
embeddedartists | 0:713518ea5028 | 147 | <!--<img src="http://www.pubnub.com/static/images/illustrations/cloud-red.png">--> |
embeddedartists | 0:713518ea5028 | 148 | |
embeddedartists | 0:713518ea5028 | 149 | <table> |
embeddedartists | 0:713518ea5028 | 150 | <tr> |
embeddedartists | 0:713518ea5028 | 151 | <td valign="top"> |
embeddedartists | 0:713518ea5028 | 152 | <table> |
embeddedartists | 0:713518ea5028 | 153 | <tr valign="top"> |
embeddedartists | 0:713518ea5028 | 154 | <td><div id="chart_div" style="width: 800px; height: 400px;"></div></td> |
embeddedartists | 0:713518ea5028 | 155 | </tr> |
embeddedartists | 0:713518ea5028 | 156 | <tr valign="top"> |
embeddedartists | 0:713518ea5028 | 157 | <td><div id="acc_chart_div" style="width: 800px; height: 400px;"></div></td> |
embeddedartists | 0:713518ea5028 | 158 | </tr> |
embeddedartists | 0:713518ea5028 | 159 | <!--<tr valign="top"> |
embeddedartists | 0:713518ea5028 | 160 | <td>Change color on RGB LED to: <input class="color" onchange="sendMessage(this.color)"></td> |
embeddedartists | 0:713518ea5028 | 161 | </tr>--> |
embeddedartists | 0:713518ea5028 | 162 | <tr valign="top"> |
embeddedartists | 0:713518ea5028 | 163 | <td> |
embeddedartists | 0:713518ea5028 | 164 | <input type="button" value="Set color to RED" onclick="sendColorMessage(1,0,0)"> |
embeddedartists | 0:713518ea5028 | 165 | <input type="button" value="Set color to GREEN" onclick="sendColorMessage(0,1,0)"> |
embeddedartists | 0:713518ea5028 | 166 | <input type="button" value="Set color to BLUE" onclick="sendColorMessage(0,0,1)"> |
embeddedartists | 0:713518ea5028 | 167 | </td> |
embeddedartists | 0:713518ea5028 | 168 | </tr> |
embeddedartists | 0:713518ea5028 | 169 | </table> |
embeddedartists | 0:713518ea5028 | 170 | </td> |
embeddedartists | 0:713518ea5028 | 171 | <td> |
embeddedartists | 0:713518ea5028 | 172 | <p><b>Data from mbed:</b></p> |
embeddedartists | 0:713518ea5028 | 173 | <div id="messageLog" style="height: 600px; width: 350px; overflow:auto;"> |
embeddedartists | 0:713518ea5028 | 174 | <ol id="messageList"> |
embeddedartists | 0:713518ea5028 | 175 | <!-- This will be populated dynamically. --> |
embeddedartists | 0:713518ea5028 | 176 | </ol> |
embeddedartists | 0:713518ea5028 | 177 | </div> |
embeddedartists | 0:713518ea5028 | 178 | </td> |
embeddedartists | 0:713518ea5028 | 179 | </tr> |
embeddedartists | 0:713518ea5028 | 180 | <tr> |
embeddedartists | 0:713518ea5028 | 181 | <td> |
embeddedartists | 0:713518ea5028 | 182 | <!--<input class="color" onchange="sendMessage(this.color)">--> |
embeddedartists | 0:713518ea5028 | 183 | </td> |
embeddedartists | 0:713518ea5028 | 184 | </tr> |
embeddedartists | 0:713518ea5028 | 185 | </body> |
embeddedartists | 0:713518ea5028 | 186 | </html> |