shri/glass.html

## glass.html
<html style="width:100%; height:100%; overflow:hidden">
<body style="width:100%; height:100%; overflow:hidden; margin:0" bgcolor="#000">
<script>

function centralTag( tags )
{
    var distances = [];
    var numTags = tags[ 0 ].length / 9;
    var minDist = 1000;

    var center = tags[ 0 ][ 0 ];

    for ( var i = 0; i < numTags; i++ )
    {
            var x = 0;
            var y = 0;

            x = ( tags[ 0 ][ 9 * i + 1 ] + tags[ 0 ][ 9 * i + 3 ] + tags[ 0 ][ 9 * i + 5 ] + tags[ 0 ][ 9 * i + 7 ] ) / 4;
            y = ( tags[ 0 ][ 9 * i + 2 ] + tags[ 0 ][ 9 * i + 4 ] + tags[ 0 ][ 9 * i + 6 ] + tags[ 0 ][ 9 * i + 8 ] ) / 4;
            x = x - 320;
            y = y - 180;

            var dist = Math.sqrt( Math.pow( x, 2 ) + Math.pow( y, 2 ) );

            if ( dist < minDist )
            {
                center = tags[ 0 ][ 9 * i ];
                minDist = dist;
            }
    }

    return center;
}

var foodInfo = {};

function getInstacart( food )
{
    var url = "https://www.kimonolabs.com/api/92kuggt8?apikey=989877be85a3ca05477428c8b41d4fbe&kimpath4=" + food;

    $.ajax({
        url: url,
        beforeSend: function(xhr) { xhr.setRequestHeader('authorization', 'Bearer E7GMyhG8skqhoW3lKO9kDYk5K2laYDXw'); },
        success: function ( response )
        {
            var results = response.results.collection1;
            var len = ( results.length > 5 ) : 5 ? results.length;

            var tree = [];

            for ( var i = 0; i < len; i++ )
            {
                tree.push( results[ i ] );
            }

            foodInfo[ food ] = tree;
        },
        error: function ( xhr, status )
        {
            console.log( xhr );
            console.log( status );
            WS.say( "error getting data" );
        }
    });
}

function main()
{

    // AR tag corresponding item, e.g. 0 is eggs, 1 is milk, etc.
    var tagList = [ "eggs", "milk", "yogurt", "chicken" ];

    for ( var i = 0; i < tagList.length; i++ )
    {
        getInstacart(tagList[ i ]);
    }

    var curtag = "";
    var currentview = "";
    var shoppingList = [];

    if (WS.scriptVersion(1)) return;
    function startCameraView()
    {
        currentview = "camera";
        WS.cameraOnBackgroundUnsafe(1, 360, 640);

        var model_ar = btoa(msgpack.pack([{'kw': {}, 'name': 'picarus.ARMarkerDetector'}]).map(function (x) {return String.fromCharCode(x)}).join(''));

        model = new WS.PicarusModel(model_ar, function ()
        {

            model.processStream( function ( tags )
            {
                tags = msgpack.unpack( tags );

                if ( tags && tags[ 0 ].length )
                {
                    curtag = tagList[ centralTag( tags ) ];

                    WS.say( curtag );
                    var items = foodInfo[ curtag ];
                    var tree = new WS.Cards();

                    for ( var i = 0; i < items.length; i++ )
                    {
                        var name = items[ i ].name;
                        var details = items[ i ].details;
                        tree.add( name, details, undefined, undefined, "Add to list", function(){shoppingList.push(name)}, "Scanner", function(){startCameraView();} );
                    }

                    WS.cardTree( tree );
                    WS.displayCardTree();
                    currentview = "item";
                }
            });
        });
    }


    startCameraView();

    WS.gestureCallback('onGestureTAP', function () {
        if ( currentview == "camera" )
        {
            if ( shoppingList.length > 0 )
            {
                var tree = new WS.Cards();
                for ( var i = 0; i < shoppingList.length; i++ )
                {
                    tree.add( shoppingList[ i ], undefined, undefined, undefined, "Remove From List", function(){shoppingList.splice( i, 1 );}, "Exit Shopping List", function(){startCameraView();});
                }
                WS.cardTree( tree );
                WS.displayCardTree();
                currentview = "list";
            }
        }
    });

}
window.onload = main;
</script>
</body>
</html>

## manifest.json
{"name":"Example"}
	<html style="width:100%; height:100%; overflow:hidden">
	<body style="width:100%; height:100%; overflow:hidden; margin:0" bgcolor="#000">
	<script>

	function centralTag( tags )
	{
	var distances = [];
	var numTags = tags[ 0 ].length / 9;
	var minDist = 1000;

	var center = tags[ 0 ][ 0 ];

	for ( var i = 0; i < numTags; i++ )
	{
	var x = 0;
	var y = 0;

	x = ( tags[ 0 ][ 9 * i + 1 ] + tags[ 0 ][ 9 * i + 3 ] + tags[ 0 ][ 9 * i + 5 ] + tags[ 0 ][ 9 * i + 7 ] ) / 4;
	y = ( tags[ 0 ][ 9 * i + 2 ] + tags[ 0 ][ 9 * i + 4 ] + tags[ 0 ][ 9 * i + 6 ] + tags[ 0 ][ 9 * i + 8 ] ) / 4;
	x = x - 320;
	y = y - 180;

	var dist = Math.sqrt( Math.pow( x, 2 ) + Math.pow( y, 2 ) );

	if ( dist < minDist )
	{
	center = tags[ 0 ][ 9 * i ];
	minDist = dist;
	}
	}

	return center;
	}

	var foodInfo = {};

	function getInstacart( food )
	{
	var url = "https://www.kimonolabs.com/api/92kuggt8?apikey=989877be85a3ca05477428c8b41d4fbe&kimpath4=" + food;

	$.ajax({
	url: url,
	beforeSend: function(xhr) { xhr.setRequestHeader('authorization', 'Bearer E7GMyhG8skqhoW3lKO9kDYk5K2laYDXw'); },
	success: function ( response )
	{
	var results = response.results.collection1;
	var len = ( results.length > 5 ) : 5 ? results.length;

	var tree = [];

	for ( var i = 0; i < len; i++ )
	{
	tree.push( results[ i ] );
	}

	foodInfo[ food ] = tree;
	},
	error: function ( xhr, status )
	{
	console.log( xhr );
	console.log( status );
	WS.say( "error getting data" );
	}
	});
	}

	function main()
	{

	// AR tag corresponding item, e.g. 0 is eggs, 1 is milk, etc.
	var tagList = [ "eggs", "milk", "yogurt", "chicken" ];

	for ( var i = 0; i < tagList.length; i++ )
	{
	getInstacart(tagList[ i ]);
	}

	var curtag = "";
	var currentview = "";
	var shoppingList = [];

	if (WS.scriptVersion(1)) return;
	function startCameraView()
	{
	currentview = "camera";
	WS.cameraOnBackgroundUnsafe(1, 360, 640);

	var model_ar = btoa(msgpack.pack([{'kw': {}, 'name': 'picarus.ARMarkerDetector'}]).map(function (x) {return String.fromCharCode(x)}).join(''));

	model = new WS.PicarusModel(model_ar, function ()
	{

	model.processStream( function ( tags )
	{
	tags = msgpack.unpack( tags );

	if ( tags && tags[ 0 ].length )
	{
	curtag = tagList[ centralTag( tags ) ];

	WS.say( curtag );
	var items = foodInfo[ curtag ];
	var tree = new WS.Cards();

	for ( var i = 0; i < items.length; i++ )
	{
	var name = items[ i ].name;
	var details = items[ i ].details;
	tree.add( name, details, undefined, undefined, "Add to list", function(){shoppingList.push(name)}, "Scanner", function(){startCameraView();} );
	}

	WS.cardTree( tree );
	WS.displayCardTree();
	currentview = "item";
	}
	});
	});
	}



	startCameraView();

	WS.gestureCallback('onGestureTAP', function () {
	if ( currentview == "camera" )
	{
	if ( shoppingList.length > 0 )
	{
	var tree = new WS.Cards();
	for ( var i = 0; i < shoppingList.length; i++ )
	{
	tree.add( shoppingList[ i ], undefined, undefined, undefined, "Remove From List", function(){shoppingList.splice( i, 1 );}, "Exit Shopping List", function(){startCameraView();});
	}
	WS.cardTree( tree );
	WS.displayCardTree();
	currentview = "list";
	}
	}
	});

	}
	window.onload = main;
	</script>
	</body>
	</html>