Pin keyboard moved to under the user profile.

ui/login/account_picker/user_pod_row.js

 // Copyright 2014 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 User pod row implementation.
  */
 
 cr.define('login', function() {
   /**
@@ skipping 717 matching lines @@
           this.handleRemoveCommandClick_.bind(this));
       this.actionBoxMenuRemoveElement.addEventListener('keydown',
           this.handleRemoveCommandKeyDown_.bind(this));
       this.actionBoxMenuRemoveElement.addEventListener('blur',
           this.handleRemoveCommandBlur_.bind(this));
       this.actionBoxRemoveUserWarningButtonElement.addEventListener('click',
           this.handleRemoveUserConfirmationClick_.bind(this));
       this.actionBoxRemoveUserWarningButtonElement.addEventListener('keydown',
           this.handleRemoveUserConfirmationKeyDown_.bind(this));
 
-      var pinKeyboard = $('pin-keyboard');
-      // The pin keyboard is not present on the md user manager.
-      if (pinKeyboard) {
-        pinKeyboard.addEventListener('submit',
-            this.handlePinSubmitted_.bind(this));
-      }
-
       var customIcon = this.customIconElement;
       customIcon.parentNode.replaceChild(new UserPodCustomIcon(), customIcon);
     },
 
     /**
      * Initializes the pod after its properties set and added to a pod row.
      */
     initialize: function() {
       this.passwordElement.addEventListener('keydown',
           this.parentNode.handleKeyDown.bind(this.parentNode));
       this.passwordElement.addEventListener('keypress',
           this.handlePasswordKeyPress_.bind(this));
 
+      if (this.pinKeyboard) {
+        this.pinKeyboard.addEventListener('submit',
+            this.handlePinSubmitted_.bind(this));
+      }
+
       this.imageElement.addEventListener('load',
           this.parentNode.handlePodImageLoad.bind(this.parentNode, this));
 
       var initialAuthType = this.user.initialAuthType ||
           AUTH_TYPE.OFFLINE_PASSWORD;
       this.setAuthType(initialAuthType, null);
 
       this.userClickAuthAllowed_ = false;
     },
 
@@ skipping 62 matching lines @@
     },
 
     /**
      * Height number of pixels.
      */
     get height() {
       return this.offsetHeight;
     },
 
     /**
+     * Gets the authorization element of the pod.
+     * @type {!HTMLDivElement}
+     */
+    get authElement() {
+      return this.querySelector('.auth-container');
+    },
+
+    /**
      * Gets image element.
      * @type {!HTMLImageElement}
      */
     get imageElement() {
       return this.querySelector('.user-image');
     },
 
     /**
      * Gets name element.
      * @type {!HTMLDivElement}
@@ skipping 29 matching lines @@
     /**
      * Gets the password label, which is used to show a message where the
      * password field is normally.
      * @type {!HTMLInputElement}
      */
     get passwordLabelElement() {
       return this.querySelector('.password-label');
     },
 
     /**
+     * Gets the pin-container of the pod.
+     * @type {!HTMLDivElement}
+     */
+    get pinContainer() {
+      return this.querySelector('.pin-container');
+    },
+
+    /**
+     * Gets the pin-keyboard of the pod.
+     * @type {!HTMLElement}
+     */
+    get pinKeyboard() {
+      return this.querySelector('pin-keyboard');
+    },
+
+    /**
      * Gets user online sign in hint element.
      * @type {!HTMLDivElement}
      */
     get reauthWarningElement() {
       return this.querySelector('.reauth-hint-container');
     },
 
     /**
+     * Gets the signed in indicator of the pod.
+     * @type {!HTMLDivElement}
+     */
+    get signInElement() {
+      return this.querySelector('.signed-in-indicator');
+    },
+
+    /**
      * Gets the container holding the launch app button.
      * @type {!HTMLButtonElement}
      */
     get launchAppButtonContainerElement() {
       return this.querySelector('.launch-app-button-container');
     },
 
     /**
      * Gets launch app button.
      * @type {!HTMLButtonElement}
@@ skipping 180 matching lines @@
           this.querySelector('.mp-policy-primary-only-msg').hidden = false;
         else if (this.user.multiProfilesPolicy == 'owner-primary-only')
           this.querySelector('.mp-owner-primary-only-msg').hidden = false;
         else
           this.querySelector('.mp-policy-not-allowed-msg').hidden = false;
       } else if (this.user_.isApp) {
         this.setUserPodIconType('app');
       }
     },
 
+    setPinVisibility: function(visible) {
+      var elements = [this, this.authElement, this.imageElement,
+                      this.signInElement, this.pinContainer];
+
+      for (var idx = 0; idx < elements.length; idx++) {
+        var currentElement = elements[idx];
+        if (visible) {
+          currentElement.classList.add('pin-enabled');
+          currentElement.classList.remove('pin-disabled');
+        }
+        else {

[xiyuan, 2016/06/24 21:19:09]

nit: move it to line 1136

[sammiequon, 2016/06/24 22:06:39]

Done.

+          currentElement.classList.remove('pin-enabled');
+          currentElement.classList.add('pin-disabled');

[xiyuan, 2016/06/24 21:19:10]

nit: we replace the if with:

currentElement.classList.toggle('pin-enabled', visible);
currentElement.classList.toggle('pin-disabled', !visible);

[sammiequon, 2016/06/24 22:06:39]

Done.

+        }
+      }
+    },
+
     setUserPodIconType: function(userTypeClass) {
       this.userTypeIconAreaElement.classList.add(userTypeClass);
       this.userTypeIconAreaElement.hidden = false;
     },
 
     /**
      * The user that this pod represents.
      * @type {!Object}
      */
     user_: undefined,
@@ skipping 1396 matching lines @@
     /**
      * Add an existing user pod to this pod row.
      * @param {!Object} user User info dictionary.
      */
     addUserPod: function(user) {
       var userPod = this.createUserPod(user);
       this.appendChild(userPod);
       userPod.initialize();
     },
 
+    setFocusedPodPinVisibility: function(visible) {
+      if (this.focusedPod_ && this.focusedPod_.user.showPin)
+        this.focusedPod_.setPinVisibility(visible);
+    },
+
     /**
      * Runs app with a given id from the list of loaded apps.
      * @param {!string} app_id of an app to run.
      * @param {boolean=} opt_diagnosticMode Whether to run the app in
      *     diagnostic mode. Default is false.
      */
     findAndRunAppForTesting: function(app_id, opt_diagnosticMode) {
       var app = this.getPodWithAppId_(app_id);
       if (app) {
         var activationEvent = cr.doc.createEvent('MouseEvents');
@@ skipping 904 matching lines @@
        if (pod && pod.multiProfilesPolicyApplied) {
          pod.userTypeBubbleElement.classList.remove('bubble-shown');
        }
      }
   };
 
   return {
     PodRow: PodRow
   };
 });