var sandstorm = sandstorm || {}

sandstorm.IndeterminateIndicator = function(target, useWebkitTransitions)
{

	this.useWebkitTransitions = useWebkitTransitions == true ? true : false;
	this.target    = target;
	this.rotations = 0;

}

sandstorm.IndeterminateIndicator.prototype.show = function()
{
	this.animate();
}

sandstorm.IndeterminateIndicator.prototype.animate = function()
{
	++this.rotations;

	if(this.useWebkitTransitions)
	{
		this.target.style.webkitTransition = '-webkit-transform ' + "1000" + 'ms linear';
		this.target.style.webkitTransform = 'rotate3d(0, 0, 1, ' + (this.rotations * 360) + 'deg)';
		this.target.style.webkitTransformOrigin = "50% 50%";

		var scope = this;
		this.target.addEventListener("webkitTransitionEnd", function()
	    {
	        return function()
	        {
	            scope.target.removeEventListener("webkitTransitionEnd", arguments.callee);
	            scope.animateComplete();
	        }
	    }(), false);

	}
	else
	{

	}
}

sandstorm.IndeterminateIndicator.prototype.animateComplete = function()
{
	console.log(-1);
	this.clearWebKitTransition();
	this.animate();

}

sandstorm.IndeterminateIndicator.prototype.clearWebKitTransition = function(position)
{
		// Get the computed style object.
		var style = document.defaultView.getComputedStyle(this.target, null);

		// Computed the transform in a matrix object given the style.
		var transform = new WebKitCSSMatrix(style.webkitTransform);

		// Clear the active transition so it doesn’t apply to our next transform.
		this.target.style.webkitTransition = '';

		// Set the element transform to where it is right now.
		this.target.style.webkitTransform = 'rotate3d(0, 0, 1, 0deg)';
}