Skip to content

Instantly share code, notes, and snippets.

@lgleasain

lgleasain/glass.html

Created March 25, 2014 00:05
Show Gist options
  • Save lgleasain/9752172 to your computer and use it in GitHub Desktop.
Save lgleasain/9752172 to your computer and use it in GitHub Desktop.
Download ZIP
[wearscript] playground
Raw
glass.html
<html style="width:100%; height:100%; overflow:hidden">
<head>
<!-- You can include external scripts here like so... -->
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.0/zepto.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"></script>-->
<link href='http://fonts.googleapis.com/css?family=Roboto:400,100,300' rel='stylesheet' type='text/css'>
</head>
<style>
body {background-color: black;}
.h1 {color:white; font-size: 100px; font-family: 'Roboto', sans-serif; font-weight: 100;}
.h2 {color:white; font-size: 70px; font-family: 'Roboto', sans-serif; font-weight: 100;}
.h3 {color:white; font-size: 40px; font-family: 'Roboto', sans-serif; font-weight: 400;}
</style>
<body style="width:640px; height:360px; overflow:hidden; margin:0">
<div id="notes">
<div class='h1' id='h1'>hello</div>
<div class='h2' id='h2'>hello</div>
<br/>
<div class='h3' id='h3'>hello</div>
</div>
<!--canvas id="canvas" width="640" height="360" style="display:block"></canvas-->
<script>
function server() {
WS.log('Welcome to WearScript');
WS.say('Lets do this');
WS.sound('SUCCESS')
// Changes canvas color with head rotation
//WS.sensorOn('orientation', .15, function (data) {
// ctx.fillStyle = 'hsl(' + data['values'][0] + ', 90%, 50%)'
// ctx.fillRect(0, 0, 640, 360);
//});
//ctx.fillStyle = '#000000';
//ctx.fillRect(0, 0, 640, 360);
// Stream several sensors (can view in the Sensors tab)
var sensors = ['gps', 'accelerometer', 'magneticField', 'gyroscope',
'light', 'gravity', 'linearAcceleration', 'rotationVector'];
for (var i = 0; i < sensors.length; i++)
WS.sensorOn(sensors[i], .15);
WS.serverConnect('ws://192.168.0.60:4000', function () {
WS.subscribe('pong', function (chan, card_text, timestamp1, groupDevice) {
//var tree = new WS.Cards();
//ctx.fillStyle = 'white';
document.getElementById('h2').innerHTML=card_text;
//WS.say(document.getElementById('notes').innerHTML);
//WS.say($('div').text());
WS.say(card_text);
//ctx.fillText(card_text, 10, 10);
//WS.say(card_text);
//WS.say('created tree' + card_text);
//tree.add(card_text, 'page');
//WS.say('added a card');
//WS.cardTree(tree);
//WS.say('set up tree');
//WS.displayCardTree();
//WS.say('Got a pong ' + card_text );
//WS.log('Pong: ' + groupDevice + ': Remote - Glass0: ' + (timestamp1 - timestamp0) + ' Glass1 - Glass0: ' + ((new Date).getTime() / 1000) - timestamp0);
});
setInterval(function () {
var date = new Date;
//WS.say(date.getSeconds().toString());
//WS.say(date.getHours().toString() + ':' + date.getMinutes().toString() + ':' date.getSeconds().toString());
temp_hours = date.getHours().toString();
hours = ('00' + date.getHours().toString()).substring(temp_hours.length, 2 + temp_hours.length);
temp_minutes = date.getMinutes().toString();
minutes = ('00' + date.getMinutes().toString()).substring(temp_minutes.length, 2 + temp_minutes.length);
temp_seconds = date.getSeconds().toString();
seconds = ('00' + date.getSeconds().toString()).substring(temp_seconds.length, 2 + temp_seconds.length);
var time_string = hours + ':' + minutes + ':' + seconds;
document.getElementById('h3').innerHTML=time_string;
//WS.publish('ping', 'pong', (new Date).getTime() / 1000);
}, 250);
WS.gestureCallback('onGesture', function (name) {
WS.publish('ping', name, '');
});
})
// Stream camera frames (can view in the Images tab)
//WS.cameraOn(.25);
//WS.dataLog(false, true, .15);
// Hookup touch and eye gesture callbacks
//WS.gestureCallback('onTwoFingerScroll', function (v, v2, v3) {
// WS.log('onTwoFingerScroll: ' + v + ', ' + v2 + ', ' + v3);
//});
//WS.gestureCallback('onEyeGesture', function (name) {
// WS.log('onEyeGesture: ' + name);
//});
//WS.gestureCallback('onGesture', function (name) {
// WS.log('onGesture: ' + name);
//});
//WS.gestureCallback('onFingerCountChanged', function (i, i2) {
// WS.log('onFingerCountChanged: ' + i + ', ' + i2);
//});
//WS.gestureCallback('onScroll', function (v, v2, v3) {
// WS.log('onScroll: ' + v + ', ' + v2 + ', ' + v3);
//});
// Below this are more examples, uncomment to use them
//WS.liveCardCreate(false, .2);
/*
var tree = new WS.Cards();
tree.add('Body text', 'Footer text', function () {WS.say('selected')}, function () {WS.say('tapped')}, 'Menu0', function () {WS.say('menu0')}, 'Menu1', function () {WS.say('menu1')});
tree.add('Body text', 'Footer text', (new WS.Cards()).add('Child0', '0').add('Child1', '1'));
WS.cardTree(tree);
WS.displayCardTree();
*/
/*
WS.speechRecognize('Say Something', function (data) {
WS.log('speech: ' + data);
WS.say('you said ' + data);
});
*/
//WS.cameraPhoto();
//WS.cameraVideo();
//WS.cameraOff();
//WS.shutdown();
}
function main() {
if (WS.scriptVersion(1)) return;
//ctx = document.getElementById('canvas').getContext("2d");
WS.serverConnect('{{WSUrl}}', server);
}
window.onload = main;
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment