From fc8f26349d24e3fbf699802a00ba80a62b631d18 Mon Sep 17 00:00:00 2001 From: "zork@chromium.org" Date: Fri, 28 Oct 2011 04:54:24 +0000 Subject: Make user remove button focusable, and set up the correct tab order. BUG=chromium-os:20044 TEST=Add two or more users. Check that you can tab to all users and remove buttons, and that you can remove users. Review URL: http://codereview.chromium.org/8396032 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@107683 0039d316-1c4b-4281-b951-d872f2087c98 --- .../resources/chromeos/login/user_pod_row.js | 24 +++++++++++++++------- .../chromeos/login/user_pod_template.html | 2 +- .../webui/chromeos/login/signin_screen_handler.cc | 2 ++ 3 files changed, 20 insertions(+), 8 deletions(-) (limited to 'chrome/browser') diff --git a/chrome/browser/resources/chromeos/login/user_pod_row.js b/chrome/browser/resources/chromeos/login/user_pod_row.js index 8b9c277..241e95c 100644 --- a/chrome/browser/resources/chromeos/login/user_pod_row.js +++ b/chrome/browser/resources/chromeos/login/user_pod_row.js @@ -15,6 +15,10 @@ cr.define('login', function() { const OAUTH_TOKEN_STATUS_INVALID = 1; const OAUTH_TOKEN_STATUS_VALID = 2; + // Tab index for pods. Update these when adding new controls. + const TAB_INDEX_POD_INPUT = 1; + const TAB_INDEX_REMOVE_USER = 2; + /** * Helper function to remove a class from given element. * @param {!HTMLElement} el Element whose class list to change. @@ -40,7 +44,7 @@ cr.define('login', function() { decorate: function() { // Make this focusable if (!this.hasAttribute('tabindex')) - this.tabIndex = 0; + this.tabIndex = TAB_INDEX_POD_INPUT; this.addEventListener('mousedown', this.handleMouseDown_.bind(this)); @@ -49,6 +53,8 @@ cr.define('login', function() { this.activate.bind(this)); this.signinButtonElement.addEventListener('click', this.activate.bind(this)); + this.removeUserButtonElement.addEventListener('click', + this.handleRemoveButtonClick_.bind(this)); this.removeUserButtonElement.addEventListener('mouseout', this.handleRemoveButtonMouseOut_.bind(this)); }, @@ -175,6 +181,9 @@ cr.define('login', function() { this.imageElement.title = userDict.emailAddress; this.enterButtonElement.hidden = true; this.passwordElement.hidden = needSignin; + this.removeUserButtonElement.setAttribute( + 'aria-label', localStrings.getStringF('removeButtonAccessibleName', + userDict.emailAddress)); this.passwordElement.setAttribute('aria-label', localStrings.getStringF( 'passwordFieldAccessibleName', @@ -319,10 +328,7 @@ cr.define('login', function() { if (!this.parentNode.rowEnabled) return; var handled = false; - if (e.target == this.removeUserButtonElement) { - this.handleRemoveButtonClick_(e); - handled = true; - } else if (!this.signinButtonElement.hidden) { + if (!this.signinButtonElement.hidden) { this.parentNode.showSigninUI(this.user.emailAddress); handled = true; } @@ -403,6 +409,8 @@ cr.define('login', function() { this.appendChild(userPod); userPod.initialize(); + var index = this.findIndex_(userPod); + userPod.removeUserButtonElement.tabIndex = TAB_INDEX_REMOVE_USER; }, /** @@ -470,6 +478,7 @@ cr.define('login', function() { // Popoulate the pod row. for (var i = 0; i < users.length; ++i) { this.addUserPod(users[i], animated); + this.pods[i].tabIndex = TAB_INDEX_POD_INPUT; } }, @@ -491,9 +500,10 @@ cr.define('login', function() { } else { this.pods[i].classList.remove('focused'); this.pods[i].classList.add('faded'); - this.pods[i].tabIndex = 0; + this.pods[i].tabIndex = TAB_INDEX_POD_INPUT; } } + pod.mainInput.tabIndex = TAB_INDEX_POD_INPUT; pod.focusInput(); this.focusedPod_ = pod; @@ -503,7 +513,7 @@ cr.define('login', function() { this.pods[i].classList.remove('focused'); this.pods[i].classList.remove('faded'); this.pods[i].activeRemoveButton = false; - this.pods[i].tabIndex = 0; + this.pods[i].tabIndex = TAB_INDEX_POD_INPUT; } this.focusedPod_ = undefined; } diff --git a/chrome/browser/resources/chromeos/login/user_pod_template.html b/chrome/browser/resources/chromeos/login/user_pod_template.html index 674e963..ea7736b 100644 --- a/chrome/browser/resources/chromeos/login/user_pod_template.html +++ b/chrome/browser/resources/chromeos/login/user_pod_template.html @@ -11,5 +11,5 @@ defined in user_pod_row.js. - + diff --git a/chrome/browser/ui/webui/chromeos/login/signin_screen_handler.cc b/chrome/browser/ui/webui/chromeos/login/signin_screen_handler.cc index 64c98fa..d191d55 100644 --- a/chrome/browser/ui/webui/chromeos/login/signin_screen_handler.cc +++ b/chrome/browser/ui/webui/chromeos/login/signin_screen_handler.cc @@ -244,6 +244,8 @@ void SigninScreenHandler::GetLocalizedStrings( l10n_util::GetStringUTF16(IDS_SIGNIN_SCREEN_TITLE)); localized_strings->SetString("passwordHint", l10n_util::GetStringUTF16(IDS_LOGIN_POD_EMPTY_PASSWORD_TEXT)); + localized_strings->SetString("removeButtonAccessibleName", + l10n_util::GetStringUTF16(IDS_LOGIN_POD_REMOVE_BUTTON_ACCESSIBLE_NAME)); localized_strings->SetString("passwordFieldAccessibleName", l10n_util::GetStringUTF16(IDS_LOGIN_POD_PASSWORD_FIELD_ACCESSIBLE_NAME)); localized_strings->SetString("signinButton", -- cgit v1.1