a system for looking at the coordinate system and interaction box of the Leap Motion Contorller

main.js

/* globals define */
define(function(require, exports, module) {
    'use strict';
    // import dependencies
    var Engine = require('famous/core/Engine');
    var Modifier = require('famous/core/Modifier');
    var Transform = require('famous/core/Transform');
    var ImageSurface = require('famous/surfaces/ImageSurface');
    var Surface = require('famous/core/Surface');

    // create the main context
    var mainContext = Engine.createContext();

    // your app here
    var logo = new ImageSurface({
        size: [200, 200],
        content: '/content/images/famous_logo.png',
        classes: ['backfaceVisibility']
    });

    var info = new Surface({
        size: [undefined, 100],
        properties: {
            backgroundColor: 'yellow'
        }
    });

    mainContext.add(new Modifier({origin: [0, 0]})).add(info);

    var initialTime = Date.now();
    var frontFinger;

    var centerSpinModifier = new Modifier({
        origin: [0.5, 0.5],
        transform: function() {
            //  return frontFinger ? Transform.rotateY(frontFinger.stabilizedTipPosition[0]/100) : Transform.rotateY(.002 * (Date.now() - initialTime));
        }
    });

    mainContext.add(centerSpinModifier).add(logo);

    function frontmost(fingers, frontFinger) {
        for (var i = 0; i < fingers.length; ++i) {
            if (!frontFinger) {
                frontFinger = fingers[i];
            } else {
                var finger = fingers[i];
                if (finger.stabilizedTipPosition &&
                    finger.stabilizedTipPosition[2] < frontFinger.stabilizedTipPosition[2]) {
                    frontFinger = finger;
                }
            }
        }

        return frontFinger;
    }

    var ib;

    var t = new Date().getTime();
    var b = false;
    Leap.loop(function(frame) {
        ib = frame.interactionBox;
        if (!b){
            console.log(ib);
            b = true;
        }

        if (!(frame.valid && frame.hands.length)) {
            return;
        }

        frontFinger = null;
        for (var i = 0; i < frame.hands.length; ++i) {
            var hand = frame.hands[i];
            frontFinger = frontmost(hand.fingers, frontFinger);
        }

function        percent(a){
    return [
        Math.round(a[0] * 100),
        Math.round(a[1] * 100),
        Math.round(a[2] * 100)
    ]
}

        if (frontFinger && new Date().getTime() -500 > t) {
         //   frontFinger.stabilizedTipPosition[1] -= 300;
            var pos = frontFinger.stabilizedTipPosition;
            var n = ib.normalizePoint(pos);
            n = [n[0], n[1], n[2]];
            var n2 = ib.normalizePoint(pos, true);
            n2 = [n2[0], n2[1], n2[2]];
            //debugger;
            var p1 = '<b>stp</b>: (' + pos.join(',') + '), ';
            var p2 = '<br /><b>norm</b>: (' + percent(n).join(',') + '), ';
            var p3 = '<br /><b>Clamp</b>: (' + percent(n2).join(',') + ')';
            info.setContent(p1 + p2 + p3);
            t = new Date().getTime();
        }
    });
});