Animations not queuing

[jsfi]

Each element has its own animation queue. Animations are queued when Element.animate is called multiple times at once with the same element. The animations will occur in order, and the first animation will occur immediately.

If I call element.animate multiple times, only one animation is executed with the united values of all animations and the duration of the last animation.

var UI = require('ui');
var Vector2 = require('vector2');

var w = new UI.Window();

var rect = new UI.Rect({
    position: new Vector2(0,0),
    size: new Vector2(10, 10)
});

w.add(rect);
w.show();

rect.animate({ size: new Vector2(10,152), easing: 'linear' }, 2000);
rect.animate({ size: new Vector2(144,152), easing: 'linear' }, 4000);

In my opinion the problem is the if-case in ui/element.js:86. When calling only element.animate multiple times the element._queue will always be empty and animate.call(this); is executed every time.

I want to ask if the error is in the documentation or my understanding of it before suggesting a solution.

[Meiguro]

Aha, you are correct, it's not properly queueing successive calls to .animate, forcing you to use .queue directly. I've made a fix that is much more straightforward than erroneously checking the queue size. Let me know if this has the semantics you need.

[trautonen]

The change is quite good. Though I wanted another extra feature, do something from custom callback when the element is idle from any animations. When you queue up a callback and the component's animation queue is empty, nothing happens. I created a pull request for this change (#168).