Evantan
23 Nov 2011, 1:16 PM
REQUIRED INFORMATION Ext version tested:
Sencha Touch 2.0PR2
Browser versions tested against:
Chrome 16
Safari 5
Description:
In src/Anim.js, it uses the event name 'webkitTransitionEnd' to bind/unbind a listener after animation end.
But according to Ext.event.publisher.Dom, it seems to should use maped name 'transitionend' instead of vendorEventName 'webkitTransitionEnd'.
So, Ext.Anim.run in Anim.js never fire event after a animation.And due to the seem reason, callback register in config.after(Ext.Anim.run(..., ..., {after: callback})) never fired.
Steps to reproduce the problem:
Setup a animation, set the autoclear as true in config, and register a callback in config.after.
The result that was expected:
After animation complete, the state(style) of element should change back as original.
callback should be fired.
The result that occurs instead:
Element keep at the animation ending state(style).
Callback never fired.
Test Case:
Ext.Anim.run(Ext.get('elementid'), 'slide', {
out: true,
after: function(){
alert('animation completed!');
},
duration: 2000,
direction: 'up',
autoClear: true
});
HELPFUL INFORMATION
Debugging already done:
yes
Possible fix:
Change line 165 in src/Anim.js(or line 15316 in sencha-touch-all-debug.js) from "el.un('webkitTransitionEnd', ...)" to "el.un('transitionend', ...)". And:
Change line 195 in src/Anim.js(or line 15346 in sencha-touch-all-debug.js) from "el.on('webkitTransitionEnd', ...)" to "el.on('transitionend', ...)".
Sencha Touch 2.0PR2
Browser versions tested against:
Chrome 16
Safari 5
Description:
In src/Anim.js, it uses the event name 'webkitTransitionEnd' to bind/unbind a listener after animation end.
But according to Ext.event.publisher.Dom, it seems to should use maped name 'transitionend' instead of vendorEventName 'webkitTransitionEnd'.
So, Ext.Anim.run in Anim.js never fire event after a animation.And due to the seem reason, callback register in config.after(Ext.Anim.run(..., ..., {after: callback})) never fired.
Steps to reproduce the problem:
Setup a animation, set the autoclear as true in config, and register a callback in config.after.
The result that was expected:
After animation complete, the state(style) of element should change back as original.
callback should be fired.
The result that occurs instead:
Element keep at the animation ending state(style).
Callback never fired.
Test Case:
Ext.Anim.run(Ext.get('elementid'), 'slide', {
out: true,
after: function(){
alert('animation completed!');
},
duration: 2000,
direction: 'up',
autoClear: true
});
HELPFUL INFORMATION
Debugging already done:
yes
Possible fix:
Change line 165 in src/Anim.js(or line 15316 in sencha-touch-all-debug.js) from "el.un('webkitTransitionEnd', ...)" to "el.un('transitionend', ...)". And:
Change line 195 in src/Anim.js(or line 15346 in sencha-touch-all-debug.js) from "el.on('webkitTransitionEnd', ...)" to "el.on('transitionend', ...)".