Reflowed the profile card in mac desktop user menu into a button (for material design user menu).

chrome/browser/ui/cocoa/profiles/profile_chooser_controller.mm

 // 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.
 
 #import "chrome/browser/ui/cocoa/profiles/profile_chooser_controller.h"
 
 #import <Carbon/Carbon.h>  // kVK_Return.
 #import <Cocoa/Cocoa.h>
 #include <stddef.h>
 
@@ skipping 68 matching lines @@
 #include "ui/native_theme/common_theme.h"
 #include "ui/native_theme/native_theme.h"
 #include "ui/native_theme/native_theme_mac.h"
 
 namespace {
 
 // Constants taken from the Windows/Views implementation at:
 // chrome/browser/ui/views/profile_chooser_view.cc
 const int kLargeImageSide = 88;
 const int kSmallImageSide = 32;
-const CGFloat kFixedMenuWidth = 250;
+const int kMdImageSide = 40;
 
 const CGFloat kVerticalSpacing = 16.0;
 const CGFloat kSmallVerticalSpacing = 10.0;
+const CGFloat kRelatedControllVerticalSpacing = 8.0;
 const CGFloat kHorizontalSpacing = 16.0;
 const CGFloat kTitleFontSize = 15.0;
 const CGFloat kTextFontSize = 12.0;
 const CGFloat kProfileButtonHeight = 30;
 const int kBezelThickness = 3;  // Width of the bezel on an NSButton.
 const int kImageTitleSpacing = 10;
 const int kBlueButtonHeight = 30;
 const CGFloat kFocusRingLineWidth = 2;
 
 // Fixed size for embedded sign in pages as defined in Gaia.
 const CGFloat kFixedGaiaViewWidth = 360;
 
 // Fixed size for the account removal view.
 const CGFloat kFixedAccountRemovalViewWidth = 280;
 
 // Fixed size for the switch user view.
 const int kFixedSwitchUserViewWidth = 320;
 
 // The tag number for the primary account.
 const int kPrimaryProfileTag = -1;
 
-gfx::Image CreateProfileImage(const gfx::Image& icon, int imageSize) {
-  return profiles::GetSizedAvatarIcon(
-      icon, true /* image is a square */, imageSize, imageSize);
+CGFloat GetFixedMenuWidth() {
+  return switches::IsMaterialDesignUserMenu() ? 240.0 : 250.0;
+}
+
+NSImage* CreateProfileImage(const gfx::Image& icon,
+                            int imageSize,
+                            profiles::AvatarShape shape) {
+  return (profiles::GetSizedAvatarIcon(icon, true /* image is a square */,
+                                       imageSize, imageSize, shape))
+      .ToNSImage();
 }
 
 // Updates the window size and position.
 void SetWindowSize(NSWindow* window, NSSize size) {
   NSRect frame = [window frame];
   frame.origin.x += frame.size.width - size.width;
   frame.origin.y += frame.size.height - size.height;
   frame.size = size;
   [window setFrame:frame display:YES];
 }
@@ skipping 414 matching lines @@
   if ((self = [super initWithFrame:frameRect])) {
     avatarMenu_ = avatarMenu;
     controller_ = controller;
 
     [self setBordered:NO];
 
     base::scoped_nsobject<CustomCircleImageCell> cell(
         [[CustomCircleImageCell alloc] init]);
     [self setCell:cell.get()];
 
-    [self setDefaultImage:CreateProfileImage(
-        profileIcon, kLargeImageSide).ToNSImage()];
+    const int imageSide =
+        switches::IsMaterialDesignUserMenu() ? kMdImageSide : kLargeImageSide;
+    [self setDefaultImage:CreateProfileImage(profileIcon, imageSide,
+                                             profiles::SHAPE_CIRCLE)];
     [self setImagePosition:NSImageOnly];
 
-    NSRect bounds = NSMakeRect(0, 0, kLargeImageSide, kLargeImageSide);
     if (editingAllowed) {
+      NSRect bounds = NSMakeRect(0, 0, imageSide, imageSide);
       [self setTarget:self];
       [self setAction:@selector(editPhoto:)];
       changePhotoImage_.reset([[TransparentBackgroundImageView alloc]
           initWithFrame:bounds]);
       [changePhotoImage_ setImage:ui::ResourceBundle::GetSharedInstance().
           GetNativeImageNamed(IDR_ICON_PROFILES_EDIT_CAMERA).AsNSImage()];
       [self addSubview:changePhotoImage_];
 
       // Hide the image until the button is hovered over.
       [changePhotoImage_ setHidden:YES];
@@ skipping 242 matching lines @@
     base::scoped_nsobject<CustomPaddingImageButtonCell> cell(
         [[CustomPaddingImageButtonCell alloc]
             initWithLeftMarginSpacing:kHorizontalSpacing
                     imageTitleSpacing:imageTitleSpacing]);
     [cell setLineBreakMode:NSLineBreakByTruncatingTail];
     [self setCell:cell.get()];
   }
   return self;
 }
 
-- (void)setHoverState:(HoverState)state {
-  [super setHoverState:state];
-  bool isHighlighted = ([self hoverState] != kHoverStateNone);
-
-  NSColor* backgroundColor = isHighlighted ? hoverColor_ : backgroundColor_;
-  [[self cell] setBackgroundColor:backgroundColor];
+- (void)drawRect:(NSRect)dirtyRect {
+  if ([self isEnabled]) {
+    bool isHighlighted = ([self hoverState] != kHoverStateNone);
+    NSColor* backgroundColor = isHighlighted ? hoverColor_ : backgroundColor_;
+    [[self cell] setBackgroundColor:backgroundColor];
+  }
+  [super drawRect:dirtyRect];
 }
 
 -(void)keyDown:(NSEvent*)event {
   // Since there is no default button in the bubble, it is safe to activate
   // all buttons on Enter as well, and be consistent with the Windows
   // implementation.
   if ([event keyCode] == kVK_Return)
     [self performClick:self];
   else
     [super keyDown:event];
@@ skipping 97 matching lines @@
 
 // Builds a tutorial card to have the user confirm the last Chrome signin,
 // Chrome sync will be delayed until the user either dismisses the tutorial, or
 // configures sync through the "Settings" link.
 - (NSView*)buildSigninConfirmationView;
 
 // Builds a tutorial card to show the last signin error.
 - (NSView*)buildSigninErrorView;
 
 // Creates the main profile card for the profile |item| at the top of
-// the bubble.
+// the bubble, for non-material-design and material design user menu
+// respectively.
 - (NSView*)createCurrentProfileView:(const AvatarMenu::Item&)item;
+- (NSView*)createMaterialDesignCurrentProfileView:(const AvatarMenu::Item&)item;
 
 // Creates the possible links for the main profile card with profile |item|.
 - (NSView*)createCurrentProfileLinksForItem:(const AvatarMenu::Item&)item
                                        rect:(NSRect)rect;
 
 // Creates the disclaimer text for supervised users, telling them that the
 // manager can view their history etc.
 - (NSView*)createSupervisedUserDisclaimerView;
 
 // Creates a main profile card for the guest user.
@@ skipping 16 matching lines @@
 // Creates the Gaia sign-in/add account view.
 - (NSView*)buildGaiaEmbeddedView;
 
 // Creates the account removal view.
 - (NSView*)buildAccountRemovalView;
 
 // Create a view that shows various options for an upgrade user who is not
 // the same person as the currently signed in user.
 - (NSView*)buildSwitchUserView;
 
-// Creates a button with |text|, an icon given by |imageResourceId| and with
-// |action|.
+// Creates a button with |text| and |action|, optionally with an icon given by
+// |imageResourceId|.
 - (NSButton*)hoverButtonWithRect:(NSRect)rect
                             text:(NSString*)text
                  imageResourceId:(int)imageResourceId
                           action:(SEL)action;
+- (BackgroundColorHoverButton*)hoverButtonWithRect:(NSRect)rect
+                                              text:(NSString*)text
+                                            action:(SEL)action;
 
 // Creates a generic link button with |title| and an |action| positioned at
 // |frameOrigin|.
 - (NSButton*)linkButtonWithTitle:(NSString*)title
                      frameOrigin:(NSPoint)frameOrigin
                           action:(SEL)action;
 
 // Creates an email account button with |title| and a remove icon. If
 // |reauthRequired| is true, the button also displays a warning icon. |tag|
 // indicates which account the button refers to.
 - (NSButton*)accountButtonWithRect:(NSRect)rect
                          accountId:(const std::string&)accountId
                                tag:(int)tag
                     reauthRequired:(BOOL)reauthRequired;
 
 - (bool)shouldShowGoIncognito;
 @end
 
 @implementation ProfileChooserController
 - (profiles::BubbleViewMode) viewMode {
   return viewMode_;
 }
 
 - (void)setTutorialMode:(profiles::TutorialMode)tutorialMode {
   tutorialMode_ = tutorialMode;
 }
 
+- (IBAction)editProfile:(id)sender {
+  avatarMenu_->EditProfile(avatarMenu_->GetActiveProfileIndex());
+  [self postActionPerformed:ProfileMetrics::PROFILE_DESKTOP_MENU_EDIT_IMAGE];
+  [self postActionPerformed:ProfileMetrics::PROFILE_DESKTOP_MENU_EDIT_NAME];
+}
+
 - (IBAction)switchToProfile:(id)sender {
   // Check the event flags to see if a new window should be created.
   bool alwaysCreate = ui::WindowOpenDispositionFromNSEvent(
       [NSApp currentEvent]) == NEW_WINDOW;
   avatarMenu_->SwitchToProfile([sender tag], alwaysCreate,
                                ProfileMetrics::SWITCH_PROFILE_ICON);
 }
 
 - (IBAction)showUserManager:(id)sender {
   UserManager::Show(base::FilePath(),
@@ skipping 277 matching lines @@
   [[self window] makeFirstResponder:dummyFocusButton];
 
   [contentView addSubview:subView];
   [contentView addSubview:dummyFocusButton];
   SetWindowSize([self window],
       NSMakeSize(NSWidth([subView frame]), NSHeight([subView frame])));
 }
 
 - (CGFloat)addSeparatorToContainer:(NSView*)container
                          atYOffset:(CGFloat)yOffset {
-  NSBox* separator = [self horizontalSeparatorWithFrame:NSMakeRect(
-      0, yOffset, kFixedMenuWidth, 0)];
+  NSBox* separator =
+      [self horizontalSeparatorWithFrame:NSMakeRect(0, yOffset,
+                                                    GetFixedMenuWidth(), 0)];
   [container addSubview:separator];
   return NSMaxY([separator frame]);
 }
 
 // Builds the fast user switcher view in |container| at |yOffset| and populates
 // it with the entries for every profile in |otherProfiles|. Returns the new
 // yOffset after adding the elements.
 - (void)buildFastUserSwitcherViewWithProfiles:(NSMutableArray*)otherProfiles
                                     atYOffset:(CGFloat)yOffset
                                   inContainer:(NSView*)container {
   // Other profiles switcher. The profiles have already been sorted
   // by their y-coordinate, so they can be added in the existing order.
   for (NSView* otherProfileView in otherProfiles) {
    [otherProfileView setFrameOrigin:NSMakePoint(0, yOffset)];
    [container addSubview:otherProfileView];
    yOffset = NSMaxY([otherProfileView frame]);
 
    yOffset = [self addSeparatorToContainer:container atYOffset: yOffset];
   }
 
-  [container setFrameSize:NSMakeSize(kFixedMenuWidth, yOffset)];
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
 }
 
 - (void)buildProfileChooserViewWithProfileView:(NSView*)currentProfileView
                                   tutorialView:(NSView*)tutorialView
                                      atYOffset:(CGFloat)yOffset
                                    inContainer:(NSView*)container
                                    displayLock:(bool)displayLock {
   // Option buttons.
-  NSRect rect = NSMakeRect(0, yOffset, kFixedMenuWidth, 0);
+  NSRect rect = NSMakeRect(0, yOffset, GetFixedMenuWidth(), 0);
   NSView* optionsView = [self createOptionsViewWithRect:rect
                                             displayLock:displayLock];
   [container addSubview:optionsView];
   rect.origin.y = NSMaxY([optionsView frame]);
 
   NSBox* separator = [self horizontalSeparatorWithFrame:rect];
   [container addSubview:separator];
   yOffset = NSMaxY([separator frame]);
 
   // For supervised users, add the disclaimer text.
   if (browser_->profile()->IsSupervised()) {
-    yOffset += kSmallVerticalSpacing;
+    yOffset += switches::IsMaterialDesignUserMenu() ? kVerticalSpacing
+                                                    : kSmallVerticalSpacing;
     NSView* disclaimerContainer = [self createSupervisedUserDisclaimerView];
     [disclaimerContainer setFrameOrigin:NSMakePoint(0, yOffset)];
     [container addSubview:disclaimerContainer];
     yOffset = NSMaxY([disclaimerContainer frame]);
-    yOffset += kSmallVerticalSpacing;
 
-    yOffset = [self addSeparatorToContainer:container atYOffset: yOffset];
+    if (!switches::IsMaterialDesignUserMenu()) {
+      yOffset += kSmallVerticalSpacing;
+      yOffset = [self addSeparatorToContainer:container atYOffset:yOffset];
+    }
   }
 
   if (viewMode_ == profiles::BUBBLE_VIEW_MODE_ACCOUNT_MANAGEMENT) {
-    NSView* currentProfileAccountsView = [self createCurrentProfileAccountsView:
-        NSMakeRect(0, yOffset, kFixedMenuWidth, 0)];
+    NSView* currentProfileAccountsView = [self
+        createCurrentProfileAccountsView:NSMakeRect(0, yOffset,
+                                                    GetFixedMenuWidth(), 0)];
     [container addSubview:currentProfileAccountsView];
     yOffset = NSMaxY([currentProfileAccountsView frame]);
 
     yOffset = [self addSeparatorToContainer:container atYOffset: yOffset];
   }
 
   // Active profile card.
   if (currentProfileView) {
-    yOffset += kVerticalSpacing;
+    const CGFloat verticalSpacing = switches::IsMaterialDesignUserMenu()
+                                        ? kRelatedControllVerticalSpacing
+                                        : kVerticalSpacing;
+    yOffset += verticalSpacing;
     [currentProfileView setFrameOrigin:NSMakePoint(0, yOffset)];
     [container addSubview:currentProfileView];
-    yOffset = NSMaxY([currentProfileView frame]) + kVerticalSpacing;
+    yOffset = NSMaxY([currentProfileView frame]) + verticalSpacing;
   }
 
   if (tutorialView) {
     [tutorialView setFrameOrigin:NSMakePoint(0, yOffset)];
     [container addSubview:tutorialView];
     yOffset = NSMaxY([tutorialView frame]);
     //TODO(mlerman): update UMA stats for the new tutorials.
   } else {
     tutorialMode_ = profiles::TUTORIAL_MODE_NONE;
   }
 
-  [container setFrameSize:NSMakeSize(kFixedMenuWidth, yOffset)];
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
 }
 
 - (NSView*)buildProfileChooserView {
   base::scoped_nsobject<NSView> container(
       [[NSView alloc] initWithFrame:NSZeroRect]);
 
   NSView* tutorialView = nil;
   NSView* currentProfileView = nil;
   base::scoped_nsobject<NSMutableArray> otherProfiles(
       [[NSMutableArray alloc] init]);
   // Local and guest profiles cannot lock their profile.
   bool displayLock = false;
   bool isFastProfileChooser =
       viewMode_ == profiles::BUBBLE_VIEW_MODE_FAST_PROFILE_CHOOSER;
   if (isFastProfileChooser) {
     // The user is using right-click switching, no need to tell them about it.
     PrefService* localState = g_browser_process->local_state();
     localState->SetBoolean(
         prefs::kProfileAvatarRightClickTutorialDismissed, true);
   }
 
   // Loop over the profiles in reverse, so that they are sorted by their
   // y-coordinate, and separate them into active and "other" profiles.
   for (int i = avatarMenu_->GetNumberOfItems() - 1; i >= 0; --i) {
     const AvatarMenu::Item& item = avatarMenu_->GetItemAt(i);
     if (item.active) {
       if (viewMode_ == profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER) {
         tutorialView = [self buildTutorialViewIfNeededForItem:item];
       }
-      currentProfileView = [self createCurrentProfileView:item];
+      currentProfileView =
+          switches::IsMaterialDesignUserMenu()
+              ? [self createMaterialDesignCurrentProfileView:item]
+              : [self createCurrentProfileView:item];
       displayLock = item.signed_in &&
           profiles::IsLockAvailable(browser_->profile());
     } else {
       [otherProfiles addObject:[self createOtherProfileView:i]];
     }
   }
   if (!currentProfileView)  // Guest windows don't have an active profile.
     currentProfileView = [self createGuestProfileView];
 
   // |yOffset| is the next position at which to draw in |container|
@@ skipping 61 matching lines @@
 
 - (NSView*)buildWelcomeUpgradeTutorialView:(const AvatarMenu::Item&)item {
   ProfileMetrics::LogProfileNewAvatarMenuUpgrade(
       ProfileMetrics::PROFILE_AVATAR_MENU_UPGRADE_VIEW);
 
   NSString* titleMessage = l10n_util::GetNSString(
       IDS_PROFILES_WELCOME_UPGRADE_TUTORIAL_TITLE);
   NSString* contentMessage = l10n_util::GetNSString(
       IDS_PROFILES_WELCOME_UPGRADE_TUTORIAL_CONTENT_TEXT);
   // For local profiles, the "Not you" link doesn't make sense.
-  NSString* linkMessage = item.signed_in ?
-      ElideMessage(
-          l10n_util::GetStringFUTF16(IDS_PROFILES_NOT_YOU, item.name),
-          kFixedMenuWidth - 2 * kHorizontalSpacing) :
-      nil;
+  NSString* linkMessage =
+      item.signed_in
+          ? ElideMessage(
+                l10n_util::GetStringFUTF16(IDS_PROFILES_NOT_YOU, item.name),
+                GetFixedMenuWidth() - 2 * kHorizontalSpacing)
+          : nil;
   NSString* buttonMessage = l10n_util::GetNSString(
       IDS_PROFILES_TUTORIAL_WHATS_NEW_BUTTON);
   return [self tutorialViewWithMode:profiles::TUTORIAL_MODE_WELCOME_UPGRADE
                        titleMessage:titleMessage
                      contentMessage:contentMessage
                         linkMessage:linkMessage
                       buttonMessage:buttonMessage
                         stackButton:YES
                      hasCloseButton:YES
                          linkAction:@selector(showSwitchUserView:)
@@ skipping 53 matching lines @@
                   buttonMessage:(NSString*)buttonMessage
                     stackButton:(BOOL)stackButton
                  hasCloseButton:(BOOL)hasCloseButton
                      linkAction:(SEL)linkAction
                    buttonAction:(SEL)buttonAction {
   tutorialMode_ = mode;
 
   NSColor* tutorialBackgroundColor =
       skia::SkColorToSRGBNSColor(profiles::kAvatarTutorialBackgroundColor);
   base::scoped_nsobject<NSView> container([[BackgroundColorView alloc]
-      initWithFrame:NSMakeRect(0, 0, kFixedMenuWidth, 0)
+      initWithFrame:NSMakeRect(0, 0, GetFixedMenuWidth(), 0)
           withColor:tutorialBackgroundColor]);
-  CGFloat availableWidth = kFixedMenuWidth - 2 * kHorizontalSpacing;
+  CGFloat availableWidth = GetFixedMenuWidth() - 2 * kHorizontalSpacing;
   CGFloat yOffset = kVerticalSpacing;
 
   // Adds links and buttons at the bottom.
   base::scoped_nsobject<NSButton> tutorialOkButton;
   if (buttonMessage) {
     tutorialOkButton.reset([[HoverButton alloc] initWithFrame:NSZeroRect]);
     [tutorialOkButton setTitle:buttonMessage];
     [tutorialOkButton setBezelStyle:NSRoundedBezelStyle];
     [tutorialOkButton setTarget:self];
     [tutorialOkButton setAction:buttonAction];
     [tutorialOkButton setAlignment:NSCenterTextAlignment];
     [tutorialOkButton sizeToFit];
   }
 
   NSButton* learnMoreLink = nil;
   if (linkMessage) {
     learnMoreLink = [self linkButtonWithTitle:linkMessage
                                   frameOrigin:NSZeroPoint
                                        action:linkAction];
     [[learnMoreLink cell] setTextColor:[NSColor whiteColor]];
   }
 
   if (stackButton) {
-    if (linkMessage) {
-      [learnMoreLink setFrameOrigin:NSMakePoint(
-          (kFixedMenuWidth - NSWidth([learnMoreLink frame])) / 2, yOffset)];
-    }
+    [learnMoreLink
+        setFrameOrigin:NSMakePoint((GetFixedMenuWidth() -
+                                    NSWidth([learnMoreLink frame])) / 2,
+                                    yOffset)];
     [tutorialOkButton setFrameSize:NSMakeSize(
         availableWidth, NSHeight([tutorialOkButton frame]))];
     [tutorialOkButton setFrameOrigin:NSMakePoint(
         kHorizontalSpacing,
         yOffset + (learnMoreLink ? NSHeight([learnMoreLink frame]) : 0))];
   } else {
     if (buttonMessage) {
       NSSize buttonSize = [tutorialOkButton frame].size;
       const CGFloat kTopBottomTextPadding = 6;
       const CGFloat kLeftRightTextPadding = 15;
       buttonSize.width += 2 * kLeftRightTextPadding;
       buttonSize.height += 2 * kTopBottomTextPadding;
       [tutorialOkButton setFrameSize:buttonSize];
-      CGFloat buttonXOffset = kFixedMenuWidth -
-          NSWidth([tutorialOkButton frame]) - kHorizontalSpacing;
+      CGFloat buttonXOffset = GetFixedMenuWidth() -
+                              NSWidth([tutorialOkButton frame]) -
+                              kHorizontalSpacing;
       [tutorialOkButton setFrameOrigin:NSMakePoint(buttonXOffset, yOffset)];
     }
 
     if (linkMessage) {
       CGFloat linkYOffset = yOffset;
       if (buttonMessage) {
         linkYOffset += (NSHeight([tutorialOkButton frame]) -
                         NSHeight([learnMoreLink frame])) / 2;
       }
       [learnMoreLink setFrameOrigin:NSMakePoint(
@@ skipping 39 matching lines @@
     NSImage* closeImage = rb->GetNativeImageNamed(IDR_CLOSE_1).ToNSImage();
     CGFloat closeImageWidth = [closeImage size].width;
     [closeButton setDefaultImage:closeImage];
     [closeButton setHoverImage:
         rb->GetNativeImageNamed(IDR_CLOSE_1_H).ToNSImage()];
     [closeButton setPressedImage:
         rb->GetNativeImageNamed(IDR_CLOSE_1_P).ToNSImage()];
     [closeButton setTarget:self];
     [closeButton setAction:@selector(dismissTutorial:)];
     [closeButton setFrameSize:[closeImage size]];
-    [closeButton setFrameOrigin:NSMakePoint(
-        kFixedMenuWidth - kHorizontalSpacing - closeImageWidth, yOffset)];
+    [closeButton
+        setFrameOrigin:NSMakePoint(GetFixedMenuWidth() - kHorizontalSpacing -
+                                       closeImageWidth,
+                                   yOffset)];
     [container addSubview:closeButton];
 
     [titleLabel setFrameSize:NSMakeSize(
         availableWidth - closeImageWidth - kHorizontalSpacing, 0)];
   } else {
     [titleLabel setFrameSize:NSMakeSize(availableWidth, 0)];
   }
 
   [GTMUILocalizerAndLayoutTweaker sizeToFitFixedWidthTextField:titleLabel];
   [container addSubview:titleLabel];
   yOffset = NSMaxY([titleLabel frame]) + kVerticalSpacing;
 
-  [container setFrameSize:NSMakeSize(kFixedMenuWidth, yOffset)];
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
   [container setFrameOrigin:NSZeroPoint];
   return container.autorelease();
 }
 
 - (NSView*)createCurrentProfileView:(const AvatarMenu::Item&)item {
   base::scoped_nsobject<NSView> container([[NSView alloc]
       initWithFrame:NSZeroRect]);
 
   CGFloat xOffset = kHorizontalSpacing;
   CGFloat yOffset = 0;
-  CGFloat availableTextWidth = kFixedMenuWidth - 2 * kHorizontalSpacing;
-  CGFloat maxAvailableTextWidth = kFixedMenuWidth - kHorizontalSpacing;
+  CGFloat availableTextWidth = GetFixedMenuWidth() - 2 * kHorizontalSpacing;
+  CGFloat maxAvailableTextWidth = GetFixedMenuWidth() - kHorizontalSpacing;
 
   // Profile options. This can be a link to the accounts view, the profile's
   // username for signed in users, or a "Sign in" button for local profiles.
   SigninManagerBase* signinManager =
       SigninManagerFactory::GetForProfile(
           browser_->profile()->GetOriginalProfile());
   if (!isGuestSession_ && signinManager->IsSigninAllowed()) {
     NSView* linksContainer = [self
         createCurrentProfileLinksForItem:item
                                     rect:NSMakeRect(xOffset, yOffset,
@@ skipping 15 matching lines @@
             profileName:base::SysUTF16ToNSString(
                             profiles::GetAvatarNameForProfile(
                                 browser_->profile()->GetPath()))
          editingAllowed:editingAllowed
          withController:self]);
 
   [container addSubview:profileName];
   yOffset = NSMaxY([profileName frame]) + 4;  // Adds a small vertical padding.
 
   // Profile icon, centered.
-  xOffset = (kFixedMenuWidth - kLargeImageSide) / 2;
+  xOffset = (GetFixedMenuWidth() - kLargeImageSide) / 2;
   base::scoped_nsobject<EditableProfilePhoto> iconView(
       [[EditableProfilePhoto alloc]
           initWithFrame:NSMakeRect(xOffset, yOffset,
                                    kLargeImageSide, kLargeImageSide)
              avatarMenu:avatarMenu_.get()
             profileIcon:item.icon
          editingAllowed:!isGuestSession_
          withController:self]);
 
   [container addSubview:iconView];
   yOffset = NSMaxY([iconView frame]);
 
   if (browser_->profile()->IsSupervised()) {
     base::scoped_nsobject<NSImageView> supervisedIcon(
         [[NSImageView alloc] initWithFrame:NSZeroRect]);
     int imageId = browser_->profile()->IsChild()
         ? IDR_ICON_PROFILES_MENU_CHILD
         : IDR_ICON_PROFILES_MENU_LEGACY_SUPERVISED;
     ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
     [supervisedIcon setImage:rb->GetNativeImageNamed(imageId).ToNSImage()];
     NSSize size = [[supervisedIcon image] size];
     [supervisedIcon setFrameSize:size];
     NSRect parentFrame = [iconView frame];
     [supervisedIcon setFrameOrigin:NSMakePoint(NSMaxX(parentFrame) - size.width,
                                                NSMinY(parentFrame))];
     [container addSubview:supervisedIcon];
   }
 
-  [container setFrameSize:NSMakeSize(kFixedMenuWidth, yOffset)];
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
+  return container.autorelease();
+}
+
+- (NSView*)createMaterialDesignCurrentProfileView:
+    (const AvatarMenu::Item&)item {
+  base::scoped_nsobject<NSView> container(
+      [[NSView alloc] initWithFrame:NSZeroRect]);
+
+  CGFloat xOffset = kHorizontalSpacing;
+  CGFloat yOffset = 0.0;
+  CGFloat cardYOffset = kRelatedControllVerticalSpacing;
+  CGFloat availableTextWidth =
+      GetFixedMenuWidth() - 3.0 * kHorizontalSpacing - kMdImageSide;
+  CGFloat maxAvailableTextWidth = GetFixedMenuWidth() - kHorizontalSpacing;
+
+  // Profile options. This can be a link to the accounts view, or a "Sign in"
+  // button for local profiles.
+  SigninManagerBase* signinManager = SigninManagerFactory::GetForProfile(
+      browser_->profile()->GetOriginalProfile());
+  NSRect profileLinksBound = NSZeroRect;
+  if (item.signed_in && switches::IsEnableAccountConsistency()) {
+    profileLinksBound = NSMakeRect(0, 0, GetFixedMenuWidth(), kVerticalSpacing);
+  } else if (!item.signed_in && signinManager->IsSigninAllowed()) {
+    profileLinksBound = NSMakeRect(xOffset, kRelatedControllVerticalSpacing,
+                                   maxAvailableTextWidth, kVerticalSpacing);
+  }
+  if (!NSIsEmptyRect(profileLinksBound)) {
+    NSView* linksContainer =
+        [self createCurrentProfileLinksForItem:item rect:profileLinksBound];
+    [container addSubview:linksContainer];
+    yOffset = NSMaxY([linksContainer frame]);
+  }
+
+  // Profile card button that contains the profile icon, name, and username.
+  NSRect rect = NSMakeRect(0, yOffset, GetFixedMenuWidth(),
+                           kMdImageSide + kVerticalSpacing);
+  NSButton* profileCard = [self hoverButtonWithRect:rect
+                                               text:[[NSString alloc] init]
+                                             action:@selector(editProfile:)];
+  [container addSubview:profileCard];
+  if (isGuestSession_)
+    [profileCard setEnabled:NO];
+
+  // Profile icon, left-aligned.
+  base::scoped_nsobject<NSImageView> iconView([[NSImageView alloc]
+      initWithFrame:NSMakeRect(xOffset, cardYOffset, kMdImageSide,
+                               kMdImageSide)]);
+  [iconView setImage:CreateProfileImage(item.icon, kMdImageSide,
+                                        profiles::SHAPE_CIRCLE)];
+  [profileCard addSubview:iconView];
+
+  // Profile name, left-aligned to the right of profile icon.
+  xOffset += kMdImageSide + kHorizontalSpacing;
+  CGFloat fontSize = kTextFontSize + 1.0;
+  NSTextField* profileName = BuildLabel(
+      base::SysUTF16ToNSString(
+          profiles::GetAvatarNameForProfile(browser_->profile()->GetPath())),
+      NSZeroPoint, nil);
+  [[profileName cell] setLineBreakMode:NSLineBreakByTruncatingTail];
+  [profileName setFont:[NSFont labelFontOfSize:fontSize]];
+  [profileName
+      setFrame:NSMakeRect(
+                   xOffset,
+                   cardYOffset +
+                       (kMdImageSide - [profileName frame].size.height) / 2,
+                   availableTextWidth, [profileName frame].size.height)];
+  [profileCard addSubview:profileName];
+
+  // Username, left-aligned to the right of profile icon and below the profile
+  // name.
+  if (item.signed_in && !switches::IsEnableAccountConsistency()) {
+    // Adjust the y-position of profile name to leave space for username.
+    cardYOffset += kMdImageSide / 2 - [profileName frame].size.height;
+    [profileName setFrameOrigin:NSMakePoint(xOffset, cardYOffset)];
+
+    NSTextField* username = BuildLabel(
+        ElideEmail(base::UTF16ToUTF8(item.username), availableTextWidth),
+        NSZeroPoint, skia::SkColorToSRGBNSColor(SK_ColorGRAY));
+    [username setFrameOrigin:NSMakePoint(xOffset, NSMaxY([profileName frame]))];
+    [profileCard addSubview:username];
+  }
+
+  // Profile badge for supervised account.
+  if (browser_->profile()->IsSupervised()) {
+    base::scoped_nsobject<NSImageView> supervisedIcon(
+        [[NSImageView alloc] initWithFrame:NSZeroRect]);
+    // TODO(janeliulwq): Replace the following two profile badge icons with
+    // smaller versions of them (24 x 24) to adapt to smaller profile icons.
+    int imageId = browser_->profile()->IsChild()
+                      ? IDR_ICON_PROFILES_MENU_CHILD
+                      : IDR_ICON_PROFILES_MENU_LEGACY_SUPERVISED;
+    ui::ResourceBundle& rb = ui::ResourceBundle::GetSharedInstance();
+    [supervisedIcon setImage:rb.GetNativeImageNamed(imageId).ToNSImage()];
+
+    NSSize size = [[supervisedIcon image] size];
+    [supervisedIcon setFrameSize:size];
+    NSRect profileIconFrame = [iconView frame];
+    const int badgeSpacing = 4;
+    [supervisedIcon setFrameOrigin:NSMakePoint(NSMaxX(profileIconFrame) -
+                                                   size.width + badgeSpacing,
+                                               NSMaxY(profileIconFrame) -
+                                                   size.height + badgeSpacing)];
+    [profileCard addSubview:supervisedIcon];
+  }
+
+  yOffset = NSMaxY([profileCard frame]);
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
   return container.autorelease();
 }
 
 - (NSView*)createCurrentProfileLinksForItem:(const AvatarMenu::Item&)item
                                        rect:(NSRect)rect {
+  if (switches::IsMaterialDesignUserMenu()) {
+    // The branch is empty for material design user menu in non-account-
+    // consistency mode, because in that case, the username would appear in the
+    // profile card instead of as a separate link here.
+    SigninManagerBase* signinManager = SigninManagerFactory::GetForProfile(
+        browser_->profile()->GetOriginalProfile());
+    DCHECK((item.signed_in && switches::IsEnableAccountConsistency()) ||
+           (!item.signed_in && signinManager->IsSigninAllowed()));
+  }
+
   base::scoped_nsobject<NSView> container([[NSView alloc] initWithFrame:rect]);
 
   // Don't double-apply the left margin to the sub-views.
   rect.origin.x = 0;
 
   // Adds right padding.
   const CGFloat kRightPadding = kHorizontalSpacing;
   rect.size.width -= kRightPadding;
 
   // The available links depend on the type of profile that is active.
   if (item.signed_in) {
-    // Signed in profiles with no authentication errors do not have a clickable
-    // email link.
     NSButton* link = nil;
     if (switches::IsEnableAccountConsistency()) {
       NSString* linkTitle = l10n_util::GetNSString(
           viewMode_ == profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER ?
               IDS_PROFILES_PROFILE_MANAGE_ACCOUNTS_BUTTON :
               IDS_PROFILES_PROFILE_HIDE_MANAGE_ACCOUNTS_BUTTON);
       SEL linkSelector =
           (viewMode_ == profiles::BUBBLE_VIEW_MODE_PROFILE_CHOOSER) ?
           @selector(showAccountManagement:) : @selector(hideAccountManagement:);
-      link = [self linkButtonWithTitle:linkTitle
-                           frameOrigin:rect.origin
-                                action:linkSelector];
-    } else {
+      if (switches::IsMaterialDesignUserMenu()) {
+        rect.size.width +=
+            kRightPadding;  // Spans the width of the entire menu.
+        link = [self hoverButtonWithRect:NSMakeRect(0, 0, rect.size.width,
+                                                    kBlueButtonHeight)
+                                    text:linkTitle
+                                  action:linkSelector];
+      } else {
+        link = [self linkButtonWithTitle:linkTitle
+                             frameOrigin:rect.origin
+                                  action:linkSelector];
+      }
+    } else if (!switches::IsMaterialDesignUserMenu()) {
       link = [self linkButtonWithTitle:base::SysUTF16ToNSString(item.username)
                            frameOrigin:rect.origin
                                 action:nil];
       if (HasAuthError(browser_->profile())) {
         [link setImage:ui::ResourceBundle::GetSharedInstance().
             GetNativeImageNamed(IDR_ICON_PROFILES_ACCOUNT_BUTTON_ERROR).
             ToNSImage()];
         [link setImagePosition:NSImageRight];
         [link setTarget:self];
         [link setAction:@selector(showAccountReauthenticationView:)];
         [link setTag:kPrimaryProfileTag];
         [[link cell]
             accessibilitySetOverrideValue:l10n_util::GetNSStringF(
             IDS_PROFILES_ACCOUNT_BUTTON_AUTH_ERROR_ACCESSIBLE_NAME,
             item.username)
                              forAttribute:NSAccessibilityTitleAttribute];
       } else {
+        // Signed in profiles with no authentication errors do not have a
+        // clickable email link.
         [link setEnabled:NO];
       }
     }
-    // -linkButtonWithTitle sizeToFit's the link. We can use the height, but
-    // need to re-stretch the width so that the link can be centered correctly
-    // in the view.
-    rect.size.height = [link frame].size.height;
-    [link setAlignment:NSCenterTextAlignment];
-    [link setFrame:rect];
-    [container addSubview:link];
-    [container setFrameSize:rect.size];
+    if (link) {
+      // -linkButtonWithTitle sizeToFit's the link. We can use the height, but
+      // need to re-stretch the width so that the link can be centered correctly
+      // in the view.
+      rect.size.height = [link frame].size.height;
+      if (!switches::IsMaterialDesignUserMenu())
+        [link setAlignment:NSCenterTextAlignment];
+      [link setFrame:rect];
+      [container addSubview:link];
+      [container setFrameSize:rect.size];
+    }
   } else {
     rect.size.height = kBlueButtonHeight;
     NSButton* signinButton = [[BlueLabelButton alloc] initWithFrame:rect];
 
     // Manually elide the button text so that the contents fit inside the bubble
     // This is needed because the BlueLabelButton cell resets the style on
     // every call to -cellSize, which prevents setting a custom lineBreakMode.
     NSString* elidedButtonText = base::SysUTF16ToNSString(gfx::ElideText(
         l10n_util::GetStringFUTF16(
             IDS_SYNC_START_SYNC_BUTTON_LABEL,
             l10n_util::GetStringUTF16(IDS_SHORT_PRODUCT_NAME)),
         gfx::FontList(), rect.size.width, gfx::ELIDE_TAIL));
 
     [signinButton setTitle:elidedButtonText];
+    if (switches::IsMaterialDesignUserMenu())
+      [signinButton sizeToFit];
     [signinButton setTarget:self];
     [signinButton setAction:@selector(showInlineSigninPage:)];
     [container addSubview:signinButton];
 
     // Sign-in promo text.
     NSTextField* promo = BuildLabel(
         l10n_util::GetNSString(IDS_PROFILES_SIGNIN_PROMO),
         NSMakePoint(0, NSMaxY([signinButton frame]) + kVerticalSpacing),
         nil);
     if (kRightPadding >= 8)
       rect.size.width += 8;  // Re-stretch a little bit to fit promo text.
     DCHECK(kRightPadding >= 8);
     [promo setFrameSize:NSMakeSize(rect.size.width, 0)];
     [GTMUILocalizerAndLayoutTweaker sizeToFitFixedWidthTextField:promo];
     [container addSubview:promo];
 
-    [container setFrameSize:NSMakeSize(
-        rect.size.width,
-        NSMaxY([promo frame]) + 4)];  // Adds a small vertical padding.
+    [container
+        setFrameSize:NSMakeSize(rect.size.width,
+                                NSMaxY([promo frame]) +
+                                    (switches::IsMaterialDesignUserMenu()
+                                         ? kRelatedControllVerticalSpacing
+                                         : 4))];
     content::RecordAction(
         base::UserMetricsAction("Signin_Impression_FromAvatarBubbleSignin"));
   }
 
   return container.autorelease();
 }
 
 - (NSView*)createSupervisedUserDisclaimerView {
   base::scoped_nsobject<NSView> container(
       [[NSView alloc] initWithFrame:NSZeroRect]);
 
   int yOffset = 0;
-  int availableTextWidth = kFixedMenuWidth - 2 * kHorizontalSpacing;
+  int availableTextWidth = GetFixedMenuWidth() - 2 * kHorizontalSpacing;
 
   NSTextField* disclaimer = BuildLabel(
       base::SysUTF16ToNSString(avatarMenu_->GetSupervisedUserInformation()),
       NSMakePoint(kHorizontalSpacing, yOffset), nil);
   [disclaimer setFrameSize:NSMakeSize(availableTextWidth, 0)];
   [GTMUILocalizerAndLayoutTweaker sizeToFitFixedWidthTextField:disclaimer];
   yOffset = NSMaxY([disclaimer frame]);
 
   [container addSubview:disclaimer];
-  [container setFrameSize:NSMakeSize(kFixedMenuWidth, yOffset)];
+  [container setFrameSize:NSMakeSize(GetFixedMenuWidth(), yOffset)];
   return container.autorelease();
 }
 
 - (NSView*)createGuestProfileView {
   gfx::Image guestIcon =
       ui::ResourceBundle::GetSharedInstance().GetNativeImageNamed(
           profiles::GetPlaceholderAvatarIconResourceID());
   AvatarMenu::Item guestItem(std::string::npos, /* menu_index, not used */
                              base::FilePath(), /* profile_path, not used */
                              guestIcon);
   guestItem.active = true;
   guestItem.name = base::SysNSStringToUTF16(
       l10n_util::GetNSString(IDS_PROFILES_GUEST_PROFILE_NAME));
 
-  return [self createCurrentProfileView:guestItem];
+  return switches::IsMaterialDesignUserMenu()
+             ? [self createMaterialDesignCurrentProfileView:guestItem]
+             : [self createCurrentProfileView:guestItem];
 }
 
 - (NSButton*)createOtherProfileView:(int)itemIndex {
   const AvatarMenu::Item& item = avatarMenu_->GetItemAt(itemIndex);
 
-  NSRect rect = NSMakeRect(
-      0, 0, kFixedMenuWidth, kBlueButtonHeight + kSmallVerticalSpacing);
+  NSRect rect = NSMakeRect(0, 0, GetFixedMenuWidth(),
+                           kBlueButtonHeight + kSmallVerticalSpacing);
   base::scoped_nsobject<BackgroundColorHoverButton> profileButton(
       [[BackgroundColorHoverButton alloc]
           initWithFrame:rect
       imageTitleSpacing:kImageTitleSpacing
         backgroundColor:GetDialogBackgroundColor()]);
 
   NSString* title = base::SysUTF16ToNSString(
       profiles::GetProfileSwitcherTextForItem(item));
   [profileButton setTitle:title];
 
   // Use the low-res, small default avatars in the fast user switcher, like
   // we do in the menu bar.
   gfx::Image itemIcon;
   AvatarMenu::GetImageForMenuButton(item.profile_path, &itemIcon);
 
-  [profileButton setDefaultImage:CreateProfileImage(
-      itemIcon, kSmallImageSide).ToNSImage()];
+  [profileButton setDefaultImage:CreateProfileImage(itemIcon, kSmallImageSide,
+                                                    profiles::SHAPE_SQUARE)];
   [profileButton setImagePosition:NSImageLeft];
   [profileButton setAlignment:NSLeftTextAlignment];
   [profileButton setBordered:NO];
   [profileButton setTag:itemIndex];
   [profileButton setTarget:self];
   [profileButton setAction:@selector(switchToProfile:)];
 
   NSSize textSize = [[profileButton title] sizeWithAttributes:@{
     NSFontAttributeName : [profileButton font]
   }];
@@ skipping 346 matching lines @@
    clickedOnLink:(id)link
          atIndex:(NSUInteger)charIndex {
   chrome::ShowSettings(browser_);
   return YES;
 }
 
 - (NSButton*)hoverButtonWithRect:(NSRect)rect
                             text:(NSString*)text
                  imageResourceId:(int)imageResourceId
                           action:(SEL)action {
-  base::scoped_nsobject<BackgroundColorHoverButton> button(
-      [[BackgroundColorHoverButton alloc]
-          initWithFrame:rect
-      imageTitleSpacing:kImageTitleSpacing
-        backgroundColor:GetDialogBackgroundColor()]);
-
-  [button setTitle:text];
+  BackgroundColorHoverButton* button =
+      [self hoverButtonWithRect:rect text:text action:action];
   ui::ResourceBundle* rb = &ui::ResourceBundle::GetSharedInstance();
   NSImage* image = rb->GetNativeImageNamed(imageResourceId).ToNSImage();
   [button setDefaultImage:image];
   [button setHoverImage:image];
   [button setPressedImage:image];
   [button setImagePosition:NSImageLeft];
+
+  return button;
+}
+
+- (BackgroundColorHoverButton*)hoverButtonWithRect:(NSRect)rect
+                                              text:(NSString*)text
+                                            action:(SEL)action {
+  base::scoped_nsobject<BackgroundColorHoverButton> button(
+      [[BackgroundColorHoverButton alloc]
+              initWithFrame:rect
+          imageTitleSpacing:kImageTitleSpacing
+            backgroundColor:GetDialogBackgroundColor()]);
+
+  [button setTitle:text];
   [button setAlignment:NSLeftTextAlignment];
   [button setBordered:NO];
   [button setTarget:self];
   [button setAction:action];
 
   return button.autorelease();
 }
 
 - (NSButton*)linkButtonWithTitle:(NSString*)title
                      frameOrigin:(NSPoint)frameOrigin
@@ skipping 82 matching lines @@
 }
 
 - (bool)shouldShowGoIncognito {
   bool incognitoAvailable =
       IncognitoModePrefs::GetAvailability(browser_->profile()->GetPrefs()) !=
           IncognitoModePrefs::DISABLED;
   return incognitoAvailable && !browser_->profile()->IsGuestSession();
 }
 
 @end