Skip to content

Instantly share code, notes, and snippets.

@scottgwald
Created March 31, 2014 06:29
Show Gist options
  • Save scottgwald/9886449 to your computer and use it in GitHub Desktop.
Save scottgwald/9886449 to your computer and use it in GitHub Desktop.
[wearscript] card with new photo
<html>
<head>
<title>Nothing in particular</title>
<script src="https://raw.github.com/janl/mustache.js/master/mustache.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.0/zepto.min.js"></script>
</head>
<body>
<script type="text/html" id="tpl_card0">
<article>
<section>
<img src="/sdcard/DCIM/Camera/20140331_014820_158.jpg" width=100% height=100%></img>
<ul class="text-x-small">
<li>Gingerbread</li>
<li>Chocolate Chip Cookies</li>
<li>Tiramisu</li>
<li>Donuts</li>
<li>Sugar Plum Gummies</li>
</ul>
</section>
<footer>
<p>Grocery list</p>
</footer>
</article>
</script>
<script type="text/javascript">
var template = '\<script type="text/javascript"\>\{{content}}</script\>';
var template1 = '\<script type="text/html" id="tpl_card1"\>\<article\>\<section\>\<img src="/sdcard/DCIM/Camera/20140331_014820_158.jpg" width=100% height=100%\>\</img\>\<ul class="text-x-small"\>\<li\>Gingerbread\</li\>\<li\>Chocolate Chip Cookies\</li\>\<li\>Tiramisu\</li\>\<li\>Donuts\</li\>\<li\>Sugar Plum Gummies\</li\>\</ul\>\</section\>\<footer\>\<p\>Groceryyy list\</p\>\</footer\>\</article\>\</script\>';
var template2 = '\<script type="text/html" id="tpl_card2"\>\<article\>\<section\>\<img src="{{path}}" width=100% height=100%\>\</img\>\<ul class="text-x-small"\>\<li\>Gingerbread\</li\>\<li\>Chocolate Chip Cookies\</li\>\<li\>Tiramisu\</li\>\<li\>Donuts\</li\>\<li\>Sugar Plum Gummies\</li\>\</ul\>\</section\>\<footer\>\<p\>{{name}}\</p\>\</footer\>\</article\>\</script\>';
var template3 = '\<script type="text/html" id="{{template_id}}"\>\<article\>\<section\>\<img src="{{path}}" width=100% height=100%\>\</img\>\<ul class="text-x-small"\>\<li\>Gingerbread\</li\>\<li\>Chocolate Chip Cookies\</li\>\<li\>Tiramisu\</li\>\<li\>Donuts\</li\>\<li\>Sugar Plum Gummies\</li\>\</ul\>\</section\>\<footer\>\<p\>{{name}}\</p\>\</footer\>\</article\>\</script\>';
var tree;
var gotPhoto = false;
var gotName = false;
var cardData = {};
var needATree = true;
function server() {
$('body').append(template1);
var data = {content: "The content"};
var cardInfo = [{name: "Rad Colors", path: "/sdcard/DCIM/Camera/20140331_014820_158.jpg"}];
var filledTemplate = Mustache.render(template, data);
var filledTemplate2 = Mustache.render(template2, cardInfo[0]);
// $('body').append(filledTemplate2);
// console.log(filledTemplate);
// WS.wake();
// WS.activityCreate();
WS.say("Meet your new friends");
tree = new WS.Cards();
// tree.addHTML('tpl_card0');
tree.add('Your new friends', 'Footer 1');
// tree.addHTML('tpl_card1');
// tree.addHTML('tpl_card2');
// WS.cardTree(tree);
// WS.displayCardTree();
addPerson();
// WS.cameraPhoto(photoCallback);
// WS.speechRecognize("Who is this?", nameCallback);
}
function main() {
if (WS.scriptVersion(1)) return;
WS.serverConnect('{{WSUrl}}', server);
}
function photoCallback(path) {
WS.say("photo callback");
cardData.path = path;
gotPhoto = true;
maybeShowTree();
}
function maybeShowTree() {
if (gotName && gotPhoto) {
showTree();
gotName = false;
gotPhoto = false;
}
}
function nameCallback(name) {
cardData.name = name;
gotName = true;
maybeShowTree();
}
function showTree(path) {
WS.say("Showing tree");
var id = "" + Math.floor(10000000 * Math.random());
cardData.template_id = id;
//var data = {name: "awesome name", path: path, template_id: id };
var ft = Mustache.render(template3, cardData);
$('body').append(ft);
card = tree.addHTML(id, undefined, addPerson);
// if (needATree) {
WS.cardTree(tree);
WS.displayCardTree();
needATree = false;
// }
}
function addPerson() {
WS.cameraPhoto(photoCallback);
WS.speechRecognize("Who is this?", nameCallback);
}
window.onload = main;
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment