[cros New-GAIA] Fix load animation.

chrome/browser/resources/chromeos/login/screen_gaia_signin.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @fileoverview Oobe signin screen implementation.
  */
 
 login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
   // Gaia loading time after which error message must be displayed and
   // lazy portal check should be fired.
   /** @const */ var GAIA_LOADING_PORTAL_SUSSPECT_TIME_SEC = 7;
 
+  // GAIA animation guard timer. Started when GAIA page is loaded
+  // (Authenticator 'ready' event) and is intended to guard against edge cases
+  // when 'showView' message is not generated/received.
+  /** @const */ var GAIA_ANIMATION_GUARD_MILLISEC = 250;
+
   // Maximum Gaia loading time in seconds.
   /** @const */ var MAX_GAIA_LOADING_TIME_SEC = 60;
 
   /** @const */ var HELP_TOPIC_ENTERPRISE_REPORTING = 2535613;
 
   return {
     EXTERNAL_API: [
       'loadAuthExtension',
       'updateAuthExtension',
       'doReload',
@@ skipping 44 matching lines @@
     isEnrollingConsumerManagement_: false,
 
     /**
      * Timer id of pending load.
      * @type {number}
      * @private
      */
     loadingTimer_: undefined,
 
     /**
+     * Timer id of a guard timer that is fired in case 'showView' message
+     * is not received from GAIA.
+     * @type {number}
+     * @private
+     */
+    loadAnimationGuardTimer_: undefined,
+
+    /**
      * Whether user can cancel Gaia screen.
      * @type {boolean}
      * @private
      */
     cancelAllowed_: undefined,
 
     /**
      * Whether we should show user pods on the login screen.
      * @type {boolean}
      * @private
@@ skipping 102 matching lines @@
      * @param {boolean} show True to show loading UI.
      * @private
      */
     showLoadingUI_: function(show) {
       $('gaia-loading').hidden = !show;
       $('signin-frame').hidden = show;
       $('signin-right').hidden = show;
       $('enterprise-info-container').hidden = show;
       $('gaia-signin-divider').hidden = show;
       this.classList.toggle('loading', show);
+      $('signin-frame').classList.remove('show');
       if (!show)
         this.classList.remove('auth-completed');
     },
 
     /**
      * Handler for Gaia loading suspiciously long timeout.
      * @private
      */
     onLoadingSuspiciouslyLong_: function() {
       if (this != Oobe.getInstance().currentScreen)
@@ skipping 30 matching lines @@
      * @private
      */
     startLoadingTimer_: function() {
       this.clearLoadingTimer_();
       this.loadingTimer_ = window.setTimeout(
           this.onLoadingSuspiciouslyLong_.bind(this),
           GAIA_LOADING_PORTAL_SUSSPECT_TIME_SEC * 1000);
     },
 
     /**
+     * Handler for GAIA animation guard timer.
+     * @private
+     */
+    onLoadAnimationGuardTimer_: function() {
+      this.loadAnimationGuardTimer_ = undefined;
+      this.onShowView_();
+    },
+
+    /**
+     * Clears GAIA animation guard timer.
+     * @private
+     */
+    clearLoadAnimationGuardTimer_: function() {
+      if (this.loadAnimationGuardTimer_) {
+        window.clearTimeout(this.loadAnimationGuardTimer_);

[dzhioev (left Google), 2015/04/13 15:18:28]

Just |clearTimeout| without window.

[Nikita (slow), 2015/04/22 13:11:18]

Done.

+        this.loadAnimationGuardTimer_ = undefined;
+      }
+    },
+
+    /**
+     * Sets up GAIA animation guard timer.
+     * @private
+     */
+    startLoadAnimationGuardTimer_: function() {
+      this.clearLoadAnimationGuardTimer_();
+      this.loadAnimationGuardTimer_ = window.setTimeout(

[dzhioev (left Google), 2015/04/13 15:18:28]

Drop window.

[Nikita (slow), 2015/04/22 13:11:18]

Done.

+          this.onLoadAnimationGuardTimer_.bind(this),
+          GAIA_ANIMATION_GUARD_MILLISEC);
+    },
+
+    /**
      * Whether Gaia is loading.
      * @type {boolean}
      */
     get loading() {
       return !$('gaia-loading').hidden;
     },
     set loading(loading) {
       if (loading == this.loading)
         return;
 
@@ skipping 193 matching lines @@
         if (this.isNewGaiaFlow)
           $('close-button-item').hidden = !(isSAML || this.cancelAllowed_);
       }
     },
 
     /**
      * Invoked when the auth host emits 'ready' event.
      * @private
      */
     onAuthReady_: function() {
+      if (this.isNewGaiaFlow)
+        this.startLoadAnimationGuardTimer_();
+
+      this.clearLoadingTimer_();
       this.loading = false;
-      this.clearLoadingTimer_();
 
-      // Show deferred error bubble.
-      if (this.errorBubble_) {
-        this.showErrorBubble(this.errorBubble_[0], this.errorBubble_[1]);
-        this.errorBubble_ = undefined;
+      if (!this.isNewGaiaFlow) {
+        // Show deferred error bubble.
+        if (this.errorBubble_) {
+          this.showErrorBubble(this.errorBubble_[0], this.errorBubble_[1]);
+          this.errorBubble_ = undefined;
+        }
+
+        chrome.send('loginWebuiReady');
+        chrome.send('loginVisible', ['gaia-signin']);
       }
 
-      chrome.send('loginWebuiReady');
-      chrome.send('loginVisible', ['gaia-signin']);
-
       // Warm up the user images screen.
       Oobe.getInstance().preloadScreen({id: SCREEN_USER_IMAGE_PICKER});
     },
 
     /**
      * Invoked when the auth host emits 'dialogShown' event.
      * @private
      */
     onDialogShown_: function() {
       $('back-button-item').disabled = true;
@@ skipping 14 matching lines @@
      * @private
      */
     onBackButton_: function(e) {
       $('back-button-item').hidden = !e.detail;
     },
 
     /**
      * Invoked when the auth host emits 'showView' event.
      * @private
      */
     onShowView_: function(e) {

[dzhioev (left Google), 2015/04/13 15:18:28]

Try to switch 'loading' state and focus webview in this method, instead of
onAuthReady_

[Nikita (slow), 2015/04/22 13:11:18]

Try that and there's a degraded UX since user is able to see field w/o focus for
a short period of time.

+      this.clearLoadAnimationGuardTimer_();
       $('signin-frame').classList.add('show');
+
+      // Show deferred error bubble.
+      if (this.errorBubble_) {
+        this.showErrorBubble(this.errorBubble_[0], this.errorBubble_[1]);
+        this.errorBubble_ = undefined;
+      }
+
+      chrome.send('loginWebuiReady');
+      chrome.send('loginVisible', ['gaia-signin']);
     },
 
     /**
      * Invoked when the user has successfully authenticated via SAML, the
      * principals API was not used and the auth host needs the user to confirm
      * the scraped password.
      * @param {number} passwordCount The number of passwords that were scraped.
      * @private
      */
     onAuthConfirmPassword_: function(passwordCount) {
@@ skipping 278 matching lines @@
       }
 
       this.classList.toggle('whitelist-error', show);
       this.loading = !show;
 
       if (!show)
         Oobe.showSigninUI();
     },
   };
 });