From 4eb231e7f053c8d6b8058100adfa140ade9510f0 Mon Sep 17 00:00:00 2001 From: "jamiewalch@google.com" Date: Wed, 3 Aug 2011 20:02:55 +0000 Subject: Improve authentication UX. BUG=None TEST=Manual Review URL: http://codereview.chromium.org/7542030 git-svn-id: svn://svn.chromium.org/chrome/trunk/src@95293 0039d316-1c4b-4281-b951-d872f2087c98 --- remoting/webapp/me2mom/_locales/en/messages.json | 40 ++++++------ remoting/webapp/me2mom/choice.css | 44 ++++++------- remoting/webapp/me2mom/choice.html | 79 ++++++++++++------------ remoting/webapp/me2mom/debug_log.css | 4 -- remoting/webapp/me2mom/remoting.js | 48 ++++---------- 5 files changed, 92 insertions(+), 123 deletions(-) (limited to 'remoting') diff --git a/remoting/webapp/me2mom/_locales/en/messages.json b/remoting/webapp/me2mom/_locales/en/messages.json index 91b9f6b..a0d51dc 100644 --- a/remoting/webapp/me2mom/_locales/en/messages.json +++ b/remoting/webapp/me2mom/_locales/en/messages.json @@ -7,10 +7,6 @@ "message": "This access code will expire in", "description": "Text preceding the access code timer" }, - "authenticateButton": { - "message": "Get OAuth2 Token…", - "description": "Label for the authenticate button" - }, "cancel": { "message": "Cancel", "description": "Label for general-purpose Cancel buttons" @@ -19,6 +15,10 @@ "message": "Connect", "description": "Label for the connect button" }, + "continueButton": { + "message": "Continue", + "description": "Label for the continue button on the pre-authorization page" + }, "debugButton": { "message": "Debug Log", "description": "Label for the debug log button" @@ -33,11 +33,7 @@ }, "disconnectButton": { "message": "Disconnect", - "description": "Label for the debug log button" - }, - "emailLabel": { - "message": "Email:", - "description": "Label to the left of the user's email address" + "description": "Label for the disconnect button" }, "errorGeneric": { "message": "An error occurred.", @@ -56,7 +52,7 @@ "description": "Error displayed if an XHR request comes back empty" }, "errorOAuthFailed": { - "message": "Unable to fetch OAuth2 token. Try revoking the token and authenticating again.", + "message": "Unable to fetch OAuth2 token. Try logging out and re-authorizing.", "description": "Error displayed if the OAuth2 token cannot be refreshed" }, "footerClient1": { @@ -103,6 +99,14 @@ "message": "Connected:", "description": "String displayed in front of the host in the in-session toolbar" }, + "logoutButton": { + "message": "Logout", + "description": "Logout button, visible if the user has authenticated" + }, + "messageAuthorize": { + "message": "In order to use IT2Me you must first grant extended access permissions to your computer. Click Continue to authorize. You only have to do this once.", + "description": "Text shown when the app first starts, or if the access token is invalidated" + }, "messageGenerating": { "message": "Generating access code…", "description": "Text shown while generating an access code" @@ -121,17 +125,17 @@ } } }, - "modeShare": { - "message": "Share", - "description": "Sub-title for the host app" + "modeAuthorize": { + "message": "Authorize", + "description": "Sub-title for the one-time authorization step" }, "modeConnect": { "message": "Connect", "description": "Sub-title for the client app" }, - "oauth2TokenLabel": { - "message": "OAuth2 Token:", - "description": "Label to the left of the authenticate/revoke button" + "modeShare": { + "message": "Share", + "description": "Sub-title for the host app" }, "ok": { "message": "OK", @@ -141,10 +145,6 @@ "message": "Chromoting", "description": "Title of the main page" }, - "revokeButton": { - "message": "Revoke", - "description": "Label for the revoke button" - }, "scaleButton": { "message": "Fit Screen", "description": "Label for the scaling button" diff --git a/remoting/webapp/me2mom/choice.css b/remoting/webapp/me2mom/choice.css index 4c7597a..eeb360d 100644 --- a/remoting/webapp/me2mom/choice.css +++ b/remoting/webapp/me2mom/choice.css @@ -72,15 +72,6 @@ label { padding: 0px 6px; } -.auth-status-control { - /* Class used to denote controls that affect authorization status. */ -} - -.auth-status-label { - color: black; - font-weight: bold; -} - .big-button { height: 2em; font-size: 16px; @@ -147,16 +138,25 @@ label { margin-bottom: 10px; } +.top-left { + font-size: 14px; + position: absolute; + top: 0.5em; + left: 0.5em; +} + +.top-right { + font-size: 14px; + position: absolute; + top: 0.5em; + right: 0.5em; +} + .waiting { color: rgb(180, 180, 180); } /* Ids */ -#control-panel { - border-bottom: 2px solid gray; - padding: 5px 10px; -} - #access-code-countdown-container { height: 50px; text-align: center; @@ -183,14 +183,6 @@ label { text-align: center; } -#choice-mode { - color: rgb(115, 115, 115); - font-size: 16px; - margin: 100px auto 0 auto; - padding: 10px; - width: 640px; -} - #cancel-button { float: right; } @@ -220,8 +212,12 @@ label { width: 64px; } -#oauth2-entry { - width: 400px; +#main { + color: rgb(115, 115, 115); + font-size: 16px; + margin: 100px auto 0 auto; + padding: 10px; + width: 640px; } #session-mode { diff --git a/remoting/webapp/me2mom/choice.html b/remoting/webapp/me2mom/choice.html index 485df8c..815882a 100644 --- a/remoting/webapp/me2mom/choice.html +++ b/remoting/webapp/me2mom/choice.html @@ -37,28 +37,20 @@ found in the LICENSE file. Loading… - + +
+ +
- - + - +