Alex Tyler
Personal web interface for the BasicKeyboard program.
Revision 0:f456beccdf56, committed 2014-10-07
- Comitter:
- alexandertyler
- Date:
- Tue Oct 07 18:34:04 2014 +0000
- Commit message:
- Final update
Changed in this revision
| tiButton.html | Show annotated file Show diff for this revision Revisions of this file |
| tiCss.css | Show annotated file Show diff for this revision Revisions of this file |
diff -r 000000000000 -r f456beccdf56 tiButton.html
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/tiButton.html Tue Oct 07 18:34:04 2014 +0000
@@ -0,0 +1,199 @@
+<html>
+<head>
+<link rel="stylesheet" type="text/css" href="tiCss.css">
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
+<script src="https://www.fabryq.net/fabryq/lib/fabryq.js"></script>
+<script type="text/javascript">
+ var alphaArray = [];
+ var currLetter;
+ var currKeyCode;
+
+
+ window.onkeydown = function(evt) {
+ evt = evt || window.event;
+ console.log(evt);
+ currKeyCode = evt.keyCode;
+ currLetter = String.fromCharCode(evt.keyCode);
+ if (evt.keyCode == 32) {
+ $('#keypress').text("Space");
+ } else if (evt.keyCode == 190) {
+ $('#keypress').text(".");
+ } else if (evt.keyCode == 8) {
+ $('#keypress').text("Backspace");
+ } else if(evt.keyCode == 13) {
+ $('#keypress').text("Enter");
+ } else if (evt.ctrlKey) {
+ $('#keypress').text("Copy");
+ } else {
+ $('#keypress').text(currLetter);
+ }
+ }
+
+
+
+ // Fabryq example app 1. This app logs temperature data and button presses from a TI SensorTag
+ // and displays them in a webpage.
+
+
+ //put install id here
+ iid = 33;
+
+ app = undefined;
+
+ // Fill in the access token here
+ token="798dd629aab0f603614b87e4019385c77e13df5a702d4276cf0d78b6b4e454bb";
+
+ $(function() {
+
+ $('#acctable1').hide();
+ $('#humidtable1').hide();
+ //$('#buttontable1').hide();
+
+ $('#statusbox').hide();
+ //$('#statusbox1').hide();
+
+
+ app = new fabryqApp();
+ app.connect(iid, connected, handler, token, "client", true);
+
+ });
+
+ var bean;
+ var hrm;
+ // Runs after a connection is established to the fabryq server
+ function connected(){
+
+ // The SET commands enable and configure the sensors and the NOTIFY
+ // commands set up notifcations for changed sensor values. The GET
+ // commands are optional and can be used to read the last value of
+ // a sensor.
+
+
+ app.dataHandler = handler;
+
+ var dts = app.getDeviceTypes();
+
+ for(var dt in dts){
+
+ if(dts[dt].name == "TI SensorTag"){
+ devices = dts[dt].getDevices();
+
+ for(var dev in devices){
+ device = devices[dev];
+ console.log(device);
+ //device.SET("humidity_service", "humidity_enable", "01");
+ //device.NOTIFY("humidity_service", "humidity_value");
+ device.NOTIFY("button_service", "button_value");
+
+ device.errorHandler = resetHandler;
+
+ }
+ }
+
+ }
+
+ }
+
+ function resetHandler(e){
+ console.log(e);
+ if(e.name=="ERROR_VIRTUAL_DEVICE_TIMED_OUT") {
+ //e.object.SET("humidity_service", "humidity_enable", "01");
+ }
+ return false;
+ }
+
+ // Runs on the result (success or failure) of all commands
+ // Update any UI with new data here
+
+ function handler(completed_action) {
+ // console.log(completed_action);
+ // console.log(completed_action.parsedResults)
+ if(completed_action.result!=null){
+
+ var currentvUUID = parseInt(completed_action.vUUID);
+
+ $('#sensorname1').text(app.fabryqNodeRoot.findDeviceByvUUID(completed_action.vUUID).name+" ");
+
+ $('#statusbox1').show();
+ $('#statusbox1').text("Connected")
+ if(completed_action.parsedResults!=undefined){
+ /*if(completed_action.parsedResults["accel_x"]!=undefined){
+ $('#acctable1').show();
+ $('#accvalue11').text(completed_action.parsedResults["accel_x"]);
+ $('#accvalue21').text(completed_action.parsedResults["accel_y"]);
+ $('#accvalue31').text(completed_action.parsedResults["accel_z"]);
+ }
+ if(completed_action.parsedResults["humidity"]!=undefined){
+ $('#humidtable1').show();
+ var d = new Date();
+ $('#humvalue11').text((Math.round(100.0*completed_action.parsedResults["temperature"])/100.0)+" at "+d.toTimeString());
+ $('#humvalue21').text(Math.round(completed_action.parsedResults["humidity"]));
+ }*/
+ if(completed_action.parsedResults["button"]!=undefined){
+ $('#buttontable1').show();
+ var val = completed_action.parsedResults["button"];
+ var button1 = (val==1||val==3)?1:0;
+ var button2 = (val==2||val==3)?1:0;
+ $('#buttonvalue11').text(button1);
+ $('#buttonvalue21').text(button2);
+ if (button2) {
+ recordAlpha();
+ }
+ if (button1) {
+ saveWord();
+ }
+
+
+ }
+ }
+
+
+
+ } else {
+ $('#statusbox').show();
+ $('#statusbox').text("Connection failed. Make sure the device is on, then refresh the page.");
+ }
+ }
+
+ function recordAlpha() {
+ if (currKeyCode == 8) {
+ alphaArray.pop();
+ } else if (currKeyCode == 13) {
+ saveWord();
+ alphaArray.length = 0;
+ } else if (currKeyCode == 190) {
+ alphaArray.push(".");
+ } else {
+ alphaArray.push(currLetter);
+ }
+ $('#currString').text(alphaArray.join(""));
+
+ }
+
+ function saveWord() {
+ prompt("Press RIGHT to copy, then LEFT to return.", alphaArray.join(""));
+
+ $('#lastString').text(alphaArray.join(""));
+ }
+
+
+</script>
+</head>
+<h1>Hands-Free</h1>
+<body id=container>
+<div><span id='statusbox'>Disconnected</span></div><br>
+<div id="sensorStat"> <span id="sensorname1">Remote Status:  </span><span id='statusbox1'>Disconnected</span></div>
+<br>
+<div><p>Current String: <span id="currString"></span></p></div>
+<div><p>Last Saved String: <span id="lastString"></span></p></div>
+<div id="keypressTable">
+ <div><p>Current Key: <span id="keypress"></span></p></div>
+</div><br>
+<div id="buttontable1">
+ <div> Button Data </div>
+ <div>Button 1: <span id="buttonvalue11"></span></div>
+ <div>Button 2: <span id="buttonvalue21"></span></div>
+</div>
+<br>
+</body>
+</html>
diff -r 000000000000 -r f456beccdf56 tiCss.css
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/tiCss.css Tue Oct 07 18:34:04 2014 +0000
@@ -0,0 +1,5 @@
+h1 { font-size: 24px; font-weight: bold; position: relative; text-align: center; }
+#sensorStat{ font-weight: bold; }
+#container{ background-color: CornflowerBlue; font-family: "Georgia", "Lucida Sans"; font-variant: small-caps; font-size: 20px; }
+#keypressTable{ position: relative; font-weight: bold; font-size: 40px; color: #000; text-align: center; float: center; border: 2px solid black; }
+#keypress{ font-size: 50px; padding-left: 10px;}