diff options
| -rw-r--r-- | ui/login/account_picker/user_pod_row.js | 10 | ||||
| -rw-r--r-- | ui/webui/resources/js/util.js | 17 |
2 files changed, 19 insertions, 8 deletions
diff --git a/ui/login/account_picker/user_pod_row.js b/ui/login/account_picker/user_pod_row.js index c36496d..ab16792 100644 --- a/ui/login/account_picker/user_pod_row.js +++ b/ui/login/account_picker/user_pod_row.js @@ -3243,14 +3243,18 @@ cr.define('login', function() { * Called right after the pod row is shown. */ handleAfterShow: function() { + var focusedPod = this.focusedPod_; + // Without timeout changes in pods positions will be animated even though // it happened when 'flying-pods' class was disabled. setTimeout(function() { Oobe.getInstance().toggleClass('flying-pods', true); + if (focusedPod) + ensureTransitionEndEvent(focusedPod); }, 0); + // Force input focus for user pod on show and once transition ends. - if (this.focusedPod_) { - var focusedPod = this.focusedPod_; + if (focusedPod) { var screen = this.parentNode; var self = this; focusedPod.addEventListener('webkitTransitionEnd', function f(e) { @@ -3259,8 +3263,6 @@ cr.define('login', function() { // Notify screen that it is ready. screen.onShow(); }); - // Guard timer for 1 second -- it would conver all possible animations. - ensureTransitionEndEvent(focusedPod, 1000); } }, diff --git a/ui/webui/resources/js/util.js b/ui/webui/resources/js/util.js index 2707dbc..82a4e50 100644 --- a/ui/webui/resources/js/util.js +++ b/ui/webui/resources/js/util.js @@ -374,10 +374,19 @@ function createElementWithClassName(type, className) { * or when no paint happens during the animation). This function sets up * a timer and emulate the event if it is not fired when the timer expires. * @param {!HTMLElement} el The element to watch for webkitTransitionEnd. - * @param {number} timeOut The maximum wait time in milliseconds for the - * webkitTransitionEnd to happen. + * @param {number=} opt_timeOut The maximum wait time in milliseconds for the + * webkitTransitionEnd to happen. If not specified, it is fetched from |el| + * using the transitionDuration style value. */ -function ensureTransitionEndEvent(el, timeOut) { +function ensureTransitionEndEvent(el, opt_timeOut) { + if (opt_timeOut === undefined) { + var style = getComputedStyle(el); + opt_timeOut = parseFloat(style.transitionDuration) * 1000; + + // Give an additional 50ms buffer for the animation to complete. + opt_timeOut += 50; + } + var fired = false; el.addEventListener('webkitTransitionEnd', function f(e) { el.removeEventListener('webkitTransitionEnd', f); @@ -386,7 +395,7 @@ function ensureTransitionEndEvent(el, timeOut) { window.setTimeout(function() { if (!fired) cr.dispatchSimpleEvent(el, 'webkitTransitionEnd', true); - }, timeOut); + }, opt_timeOut); } /** |