Initial commit

[danzaner]

This branch adds a basic "spinner" widget for indicating when the user should wait for an operation to complete. Only Famo.us objects are used; there are no images in Spinner.js. The diameter, number of tick marks around the circle, speed of "rotation" and color of the spinner may be configured via options. Usage is straight-forward, though there is a quirk when positioning with "origin" Modifiers. Assume a View or subclass for the following code snippet:

this.spinnerModifier = new StateModifier({
    origin: [0.5, 0.5],
    transform: Transform.translate(0, 0, 500)
});
this.spinner = new Spinner({
    size: [40, 40],
    ticks: 12,
    speed: 100,
    originCompensation: true,
    properties: {
        color: 'red'
    }
});
this.add(this.spinnerModifier).add(this.spinner);
...
this.spinner.start();
...
this.spinner.stop();

The "origin" Modifier that positions the entire spinner in the center of the View also modifies the origin/rotation point of each "tick". Use "originCompensation" set to "true" to compensate for this. If not positioning the spinner with an "origin" Modifier, leave "originCompensation" set to the default "false". Spinner.start() and Spinner.stop() will show and hide the spinner (which is simply an extension of RenderController.) The "rotation" of tick opacities will also start and stop. options.speed (in ms) controls the tick opacity changes. Note that "options.size" sets the size and is left as a two Number array for consistency with other size options. In practice, the width and height should always be set to the same number, though this is not enforced in the code.

[dmvaldman]

Hey there. We're going to have another repository soon to assimilate views and widgets made by the community, but not packaged with the core Famo.us repo. I think this would be a great addition. @fettermania