feat($animator): provide support for custom animation events

This commit is contained in:
Matias Niemelä 2013-05-13 17:37:52 -04:00 committed by Igor Minar
parent 24ed61cf5c
commit c53d4c9430
2 changed files with 84 additions and 0 deletions

View file

@ -253,6 +253,20 @@ var $AnimatorProvider = function() {
* @param {jQuery/jqLite element} element the element that will be rendered visible or hidden
*/
animator.hide = animateActionFactory('hide', noop, hide);
/**
* @ngdoc function
* @name ng.animator#animate
* @methodOf ng.$animator
*
* @description
* Triggers a custom animation event to be executed on the given element
*
* @param {jQuery/jqLite element} element that will be animated
*/
animator.animate = function(event, element) {
animateActionFactory(event, noop, noop)(element);
}
return animator;
function animateActionFactory(type, beforeFn, afterFn) {

View file

@ -352,6 +352,18 @@ describe("$animator", function() {
expect(element.hasClass('animation-cancelled')).toBe(true);
}));
it("should properly animate custom animation events", inject(function($animator, $rootScope) {
$animator.enabled(true);
animator = $animator($rootScope, {
ngAnimate : '{custom: \'setup-memo\'}'
});
element.text('123');
animator.animate('custom',element);
window.setTimeout.expect(1).process();
expect(element.text()).toBe('memento');
}));
});
describe("with CSS3", function() {
@ -368,6 +380,64 @@ describe("$animator", function() {
})
});
it("should properly animate custom animations for specific animation events",
inject(function($animator, $rootScope, $compile, $sniffer) {
$animator.enabled(true);
var element = $compile(html('<div></div>'))($rootScope);
animator = $animator($rootScope, {
ngAnimate : '{custom: \'special\'}'
});
animator.animate('custom',element);
if($sniffer.transitions) {
expect(element.hasClass('special')).toBe(true);
window.setTimeout.expect(1).process();
expect(element.hasClass('special-active')).toBe(true);
}
else {
expect(window.setTimeout.queue.length).toBe(0);
}
}));
it("should not animate custom animations if not specifically defined",
inject(function($animator, $rootScope, $compile) {
$animator.enabled(true);
var element = $compile(html('<div></div>'))($rootScope);
animator = $animator($rootScope, {
ngAnimate : '{custom: \'special\'}'
});
expect(window.setTimeout.queue.length).toBe(0);
animator.animate('custom1',element);
expect(element.hasClass('special')).toBe(false);
expect(window.setTimeout.queue.length).toBe(0);
}));
it("should properly animate custom animations for general animation events",
inject(function($animator, $rootScope, $compile, $sniffer) {
$animator.enabled(true);
var element = $compile(html('<div></div>'))($rootScope);
animator = $animator($rootScope, {
ngAnimate : "'special'"
});
animator.animate('custom',element);
if($sniffer.transitions) {
expect(element.hasClass('special-custom')).toBe(true);
window.setTimeout.expect(1).process();
expect(element.hasClass('special-custom-active')).toBe(true);
}
else {
expect(window.setTimeout.queue.length).toBe(0);
}
}));
describe("Animations", function() {
it("should properly detect and make use of CSS Animations",
inject(function($animator, $rootScope, $compile, $sniffer) {