ash: Add password and PIN views to AuthDialogDebugView

The password and PIN views are used to receive password or PIN
from the user. The relationship between the password and PIN views
(both visually and functionally) should be the same as in lock screen.

Because the in-session auth dialog uses white background, the
password and PIN views are set to other colors to be visible.

A follow-up change will query whether the user has PIN set up and hide
the PIN view if there's no PIN.

Bug: b:156258540
Change-Id: I63ab51839ce913ee61f159e3e56861dd9f4f735f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2342364
Commit-Queue: Yicheng Li <yichengli@chromium.org>
Reviewed-by: Xiyuan Xia <xiyuan@chromium.org>
Cr-Commit-Position: refs/heads/master@{#796512}

ash/in_session_auth/auth_dialog_debug_view.cc

@@ -7,10 +7,15 @@
 #include <memory>
 #include <utility>
 
+#include "ash/login/ui/login_password_view.h"
+#include "ash/login/ui/login_pin_view.h"
 #include "ash/login/ui/non_accessible_view.h"
 #include "ash/login/ui/views_utils.h"
 #include "ash/public/cpp/in_session_auth_dialog_controller.h"
+#include "ash/strings/grit/ash_strings.h"
+#include "base/bind_helpers.h"
 #include "base/strings/utf_string_conversions.h"
+#include "ui/base/l10n/l10n_util.h"
 #include "ui/views/background.h"
 #include "ui/views/controls/button/md_text_button.h"
 #include "ui/views/controls/label.h"
@@ -35,7 +40,7 @@ const char kCancelButtonText[] = "Cancel";
 const int kContainerPreferredWidth = 512;
 const int kTopVerticalSpacing = 24;
 const int kVerticalSpacingBetweenTitleAndPrompt = 16;
-const int kVerticalSpacingBetweenPromptAndButtons = 32;
+const int kVerticalSpacingBetweenPasswordAndPINKeyboard = 16;
 const int kBottomVerticalSpacing = 20;
 const int kButtonSpacing = 8;
 
@@ -61,9 +66,16 @@ AuthDialogDebugView::AuthDialogDebugView() {
   AddTitleView();
   AddVerticalSpacing(kVerticalSpacingBetweenTitleAndPrompt);
   AddPromptView();
-  AddVerticalSpacing(kVerticalSpacingBetweenPromptAndButtons);
+  // TODO(b/156258540): Add proper spacing once all elements are determined.
+  AddPasswordView();
+  AddPinView();
+  AddVerticalSpacing(kVerticalSpacingBetweenPasswordAndPINKeyboard);
+  // TODO(b/156258540): Add fingerprint icon view and proper spacing.
   AddActionButtonsView();
   AddVerticalSpacing(kBottomVerticalSpacing);
+
+  // Deferred because it needs the pin_view_ pointer.
+  InitPasswordView();
 }
 
 AuthDialogDebugView::~AuthDialogDebugView() = default;
@@ -94,13 +106,50 @@ void AuthDialogDebugView::AddPromptView() {
   prompt_->SetFontList(base_font_list.Derive(kPromptFontSize,
                                              gfx::Font::FontStyle::NORMAL,
                                              gfx::Font::Weight::NORMAL));
-  // TODO(yichengli): Use a different prompt if the board has no fingerprint
+  // TODO(b/156258540): Use a different prompt if the board has no fingerprint
   // sensor.
   prompt_->SetText(base::UTF8ToUTF16(kFingerprintPrompt));
   prompt_->SetMaximumWidth(kContainerPreferredWidth);
   prompt_->SetElideBehavior(gfx::ElideBehavior::ELIDE_TAIL);
 }
 
+void AuthDialogDebugView::AddPasswordView() {
+  password_view_ = container_->AddChildView(
+      std::make_unique<LoginPasswordView>(CreateInSessionAuthPalette()));
+
+  password_view_->SetPaintToLayer();
+  password_view_->layer()->SetFillsBoundsOpaquely(false);
+  password_view_->SetDisplayPasswordButtonVisible(true);
+  password_view_->SetEnabled(true);
+  password_view_->SetEnabledOnEmptyPassword(false);
+  password_view_->SetFocusEnabledForChildViews(true);
+  password_view_->SetVisible(true);
+
+  // TODO(b/156258540): Set this text according to "has PIN or not".
+  password_view_->SetPlaceholderText(
+      l10n_util::GetStringUTF16(IDS_ASH_LOGIN_POD_PASSWORD_PIN_PLACEHOLDER));
+}
+
+void AuthDialogDebugView::AddPinView() {
+  pin_view_ = container_->AddChildView(std::make_unique<LoginPinView>(
+      LoginPinView::Style::kAlphanumeric, CreateInSessionAuthPalette(),
+      base::BindRepeating(&LoginPasswordView::InsertNumber,
+                          base::Unretained(password_view_)),
+      base::BindRepeating(&LoginPasswordView::Backspace,
+                          base::Unretained(password_view_)),
+      base::BindRepeating(&LoginPasswordView::SubmitPassword,
+                          base::Unretained(password_view_))));
+  pin_view_->SetVisible(true);
+}
+
+void AuthDialogDebugView::InitPasswordView() {
+  password_view_->Init(base::BindRepeating(&AuthDialogDebugView::OnAuthSubmit,
+                                           base::Unretained(this)),
+                       base::BindRepeating(&LoginPinView::OnPasswordTextChanged,
+                                           base::Unretained(pin_view_)),
+                       base::DoNothing(), base::DoNothing());
+}
+
 void AuthDialogDebugView::AddVerticalSpacing(int height) {
   auto* spacing =
       container_->AddChildView(std::make_unique<NonAccessibleView>());
@@ -130,7 +179,7 @@ void AuthDialogDebugView::ButtonPressed(views::Button* sender,
     InSessionAuthDialogController::Get()->DestroyAuthenticationDialog();
   }
 
-  // TODO(yichengli): Enable more options button when we have both fingerprint
+  // TODO(b/156258540): Enable more options button when we have both fingerprint
   // view and password input view.
 }
 
@@ -148,4 +197,8 @@ views::LabelButton* AuthDialogDebugView::AddButton(const std::string& text,
   return view;
 }
 
+void AuthDialogDebugView::OnAuthSubmit(const base::string16& password) {
+  // TODO(b/156258540): Call InSessionAuthDialogController to authenticate user.
+}
+
 }  // namespace ash

ash/in_session_auth/auth_dialog_debug_view.h

@@ -18,6 +18,9 @@ class LabelButton;
 
 namespace ash {
 
+class LoginPasswordView;
+class LoginPinView;
+
 // Contains the debug views that allows the developer to interact with the
 // AuthDialogController.
 class AuthDialogDebugView : public views::View, public views::ButtonListener {
@@ -37,6 +40,15 @@ class AuthDialogDebugView : public views::View, public views::ButtonListener {
   // Add a view for the prompt message.
   void AddPromptView();
 
+  // Add a view for password input field.
+  void AddPasswordView();
+
+  // Add a PIN pad view.
+  void AddPinView();
+
+  // Initializes password input field functionality.
+  void InitPasswordView();
+
   // Add a vertical spacing view.
   void AddVerticalSpacing(int height);
 
@@ -48,6 +60,9 @@ class AuthDialogDebugView : public views::View, public views::ButtonListener {
                                 int id,
                                 views::View* container);
 
+  // Called when the user submits password or PIN.
+  void OnAuthSubmit(const base::string16& password);
+
   // Debug container which holds the entire debug UI.
   views::View* container_ = nullptr;
 
@@ -60,6 +75,12 @@ class AuthDialogDebugView : public views::View, public views::ButtonListener {
   // Prompt message to the user.
   views::Label* prompt_ = nullptr;
 
+  // Password input field for password and PIN.
+  LoginPasswordView* password_view_ = nullptr;
+
+  // PIN pad view.
+  LoginPinView* pin_view_ = nullptr;
+
   // Show other authentication mechanisms if more than one.
   views::LabelButton* more_options_button_ = nullptr;
 

ash/login/ui/login_palette.cc

@@ -20,4 +20,15 @@ LoginPalette CreateDefaultLoginPalette() {
        .pin_backspace_icon_color = gfx::kGoogleGrey200});
 }
 
+LoginPalette CreateInSessionAuthPalette() {
+  return LoginPalette(
+      {.password_text_color = SK_ColorDKGRAY,
+       .password_placeholder_text_color = SK_ColorDKGRAY,
+       .password_background_color = SK_ColorTRANSPARENT,
+       .button_enabled_color = SK_ColorDKGRAY,
+       .pin_ink_drop_highlight_color = SkColorSetA(SK_ColorDKGRAY, 0x0A),
+       .pin_ink_drop_ripple_color = SkColorSetA(SK_ColorDKGRAY, 0x0F),
+       .pin_backspace_icon_color = SK_ColorDKGRAY});
+}
+
 }  // namespace ash

ash/login/ui/login_palette.h

@@ -24,8 +24,12 @@ struct LoginPalette {
   SkColor pin_backspace_icon_color;
 };
 
+// For login screen and lock screen.
 ASH_EXPORT LoginPalette CreateDefaultLoginPalette();
 
+// For in-session auth dialog.
+ASH_EXPORT LoginPalette CreateInSessionAuthPalette();
+
 }  // namespace ash
 
 #endif  // ASH_LOGIN_UI_LOGIN_PALETTE_H_