Skip to content

Commit 77ae08e

Browse files
KamilaHasanbegakbsriram
authored andcommitted
Authorization and design
Added the case in which the user is Logged in but does not have authorizations. Fixed the flow accordingly. Fixed the design of the rest.
1 parent b0cac2d commit 77ae08e

25 files changed

+445
-78
lines changed

chrome/_locales/en/messages.json

+46-2
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,42 @@
1515
"message": "Sign in",
1616
"description": "Title for a screen that's shown to a not logged in user of E2EMail."
1717
},
18+
"placeHolderLatin": {
19+
"message": "This allows E2Email to lorem ipsum lorem ipsum lorem ipsum",
20+
"description": "to be changed once we get the text."
21+
},
22+
"signInAndPermissions": {
23+
"message": "Sign in & permissions",
24+
"description": "Title for a screen that's shown to a not logged in user of E2EMail."
25+
},
26+
"permissions": {
27+
"message": "Gmail permissions",
28+
"description": "Title for a screen that's shown to a logged in user of E2EMail who has not authorized the app."
29+
},
30+
"accessEmail": {
31+
"message": "1. Access your email",
32+
"description": "Title for a screen that's shown to a not logged in user of E2EMail."
33+
},
34+
"deleteEmail": {
35+
"message": "2. Delete email in your Gmail inbox",
36+
"description": "Title for giving access to delete mail in your Gmail inbox permission."
37+
},
38+
"logInEmailAccess": {
39+
"message": "2. Give E2Email access to your email",
40+
"description": "Title for a giving access to Gmail permission."
41+
},
42+
"logInDeleteAccess": {
43+
"message": "3. Give E2Email access to delete mail your Gmail inbox",
44+
"description": "Title for giving access to delete mail in your Gmail inbox permission."
45+
},
46+
"signInChrome": {
47+
"message": "1. Sign in to Chrome",
48+
"description": "Title for a screen that's shown to a not logged in user of E2EMail."
49+
},
50+
"openGmailSettings": {
51+
"message": "Open Gmail Settings",
52+
"description": "Title for a button that's shown to a not authorized user of E2EMail."
53+
},
1854
"appinfoTitle": {
1955
"message": "About E2EMail",
2056
"description": "Title for information about the app itself."
@@ -36,7 +72,11 @@
3672
"description": "Status message while an unencrypted mail is being sent to a friend to invite them to install E2EMail."
3773
},
3874
"welcomeHelp": {
39-
"message": "In order to encrypt messages using Gmail, E2Email needs you to sign in to Chrome.",
75+
"message": "In order to encrypt messages using Gmail, E2Email needs you to:",
76+
"description": "Informational text for a user giving them a reason to use E2EMail."
77+
},
78+
"authorizationHelp": {
79+
"message": "In order to encrypt messages using Gmail, E2Email needs permissions to:",
4080
"description": "Informational text for a user giving them a reason to use E2EMail."
4181
},
4282
"signIn": {
@@ -77,6 +117,10 @@
77117
"message": "Recover Access",
78118
"description": "Title for a screen where the user can recover access to their account."
79119
},
120+
"recoveryCodeInput": {
121+
"message": "Recovery code:",
122+
"description": "Title for the instruction prior to the recovery code input box."
123+
},
80124
"recoverHelp": {
81125
"message": "You have previously installed E2EMail. Please enter your recovery code to access your encrypted mail.",
82126
"description": "Help text to help the user understand why they need to recover their account, and what they need to do to recover it."
@@ -232,7 +276,7 @@
232276
"description": "Verb to use on a button to indicate the start setting up a new account."
233277
},
234278
"endtoendProtection": {
235-
"message": "End to end protection",
279+
"message": "End-to-end protection",
236280
"description": "Describes the type of protection for the email service."
237281
},
238282
"recipientInfo": {

chrome/app.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -150,7 +150,7 @@ h1.wizard-title {
150150

151151
.btn-primary {
152152
width: 240px;
153-
height: 60px;
153+
height: 55px;
154154
font-size: 18px;
155155
padding: 10px 30px;
156156
}

chrome/app.js

+8
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ goog.require('e2email.components.translatefilter.module');
3535
goog.require('e2email.components.userinfo.module');
3636
goog.require('e2email.components.userlist.module');
3737
goog.require('e2email.constants.Location');
38+
goog.require('e2email.pages.authorization.AuthorizationCtrl');
3839
goog.require('e2email.pages.getstarted.GetStartedCtrl');
3940
goog.require('e2email.pages.introduction.IntroductionCtrl');
4041
goog.require('e2email.pages.messages.MessagesCtrl');
@@ -75,6 +76,11 @@ e2email.application.routeProvider = function($routeProvider) {
7576
templateUrl: 'pages/welcome/welcome.html',
7677
controller: 'WelcomeCtrl',
7778
controllerAs: 'welcomeCtrl'
79+
}).when(e2email.constants.Location.AUTHORIZATION, {
80+
pageTitle: 'E2EMail - Authorization',
81+
templateUrl: 'pages/authorization/authorization.html',
82+
controller: 'AuthorizationCtrl',
83+
controllerAs: 'authorizationCtrl'
7884
}).when(e2email.constants.Location.RESET, {
7985
pageTitle: 'E2EMail - Reset',
8086
templateUrl: 'pages/reset/reset.html',
@@ -163,6 +169,8 @@ e2email.application.module.controller(
163169
'ThreadsCtrl', e2email.pages.threads.ThreadsCtrl);
164170
e2email.application.module.controller(
165171
'WelcomeCtrl', e2email.pages.welcome.WelcomeCtrl);
172+
e2email.application.module.controller(
173+
'AuthorizationCtrl', e2email.pages.authorization.AuthorizationCtrl);
166174
e2email.application.module.controller(
167175
'IntroductionCtrl', e2email.pages.introduction.IntroductionCtrl);
168176
e2email.application.module.controller(

chrome/components/gmail/gmail-service.js

+5-5
Original file line numberDiff line numberDiff line change
@@ -1704,14 +1704,14 @@ GmailService.prototype.mimeSanitize_ = function(input) {
17041704
* Fetch a logged-in user's email address, if available.
17051705
* @return {!angular.$q.Promise<string>} A promise with the
17061706
* email address, or null if it wasn't found.
1707-
* @private
1708-
*/
1709-
GmailService.prototype.getEmailInfo_ = function() {
1707+
*/
1708+
GmailService.prototype.getEmailAddress = function() {
17101709
var deferred = this.q_.defer();
17111710

17121711
this.chrome_.identity.getProfileUserInfo(function(info) {
17131712
if (goog.isDefAndNotNull(info) &&
1714-
goog.isDefAndNotNull(info['email'])) {
1713+
goog.isDefAndNotNull(info['email']) &&
1714+
info['email'] !== '') {
17151715
deferred.resolve(info['email']);
17161716
} else {
17171717
deferred.resolve(null);
@@ -1767,7 +1767,7 @@ GmailService.prototype.getAllAuthorizations_ = function(interactive) {
17671767
access_token = token;
17681768
// We have a token for the main scope; now chain a promise that
17691769
// gets the user's email.
1770-
return this.getEmailInfo_();
1770+
return this.getEmailAddress();
17711771
} else {
17721772
// access token not available, continue to pass on a null.
17731773
return null;

chrome/constants.js

+1
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,7 @@ e2email.constants.Location = {
3434
SHOWSECRET: '/showsecret',
3535
THREADS: '/threads',
3636
WELCOME: '/welcome',
37+
AUTHORIZATION: '/authorization',
3738
INTRODUCTION: '/introduction',
3839
GETSTARTED: '/getstarted'
3940
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,112 @@
1+
/**
2+
* @license
3+
* Copyright 2016 E2EMail authors. All rights reserved.
4+
* Licensed under the Apache License, Version 2.0 (the "License");
5+
* you may not use this file except in compliance with the License.
6+
* You may obtain a copy of the License at
7+
*
8+
* http://www.apache.org/licenses/LICENSE-2.0
9+
*
10+
* Unless required by applicable law or agreed to in writing, software
11+
* distributed under the License is distributed on an "AS IS" BASIS,
12+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
* See the License for the specific language governing permissions and
14+
* limitations under the License.
15+
*/
16+
17+
/**
18+
* @fileoverview controller for the authorization page.
19+
*/
20+
goog.provide('e2email.pages.authorization.AuthorizationCtrl');
21+
22+
goog.scope(function() {
23+
24+
25+
26+
/**
27+
* Authorization page controller. The view is launched if the application
28+
* discovers the user is not authorized to connect to Gmail but the user
29+
* is logged in to chrome, and
30+
* contains a method to launch the sign-in prcoess. If the sign-in flow
31+
* succeeds, it launches the setup view, otherwise it remains in this
32+
* view.
33+
*
34+
* @param {!angular.$location} $location the angular $location service.
35+
* @param {!e2email.components.translate.TranslateService} translateService
36+
* @param {!e2email.components.gmail.GmailService} gmailService
37+
* the gmail service.
38+
* @constructor
39+
* @ngInject
40+
* @export
41+
*/
42+
e2email.pages.authorization.AuthorizationCtrl = function(
43+
$location, translateService, gmailService) {
44+
/** @type {boolean} */
45+
this.inProgress = false;
46+
/**
47+
* @private {!angular.$location}
48+
*/
49+
this.location_ = $location;
50+
/**
51+
* @private {!e2email.components.translate.TranslateService}
52+
*/
53+
this.translateService_ = translateService;
54+
/**
55+
* @private {!e2email.components.gmail.GmailService}
56+
*/
57+
this.gmailService_ = gmailService;
58+
/**
59+
* @type {?string}
60+
*/
61+
this.status = null;
62+
};
63+
64+
var AuthorizationCtrl = e2email.pages.authorization.AuthorizationCtrl;
65+
66+
67+
/**
68+
* Start the chrome OAuth signin-process.
69+
* @export
70+
*/
71+
AuthorizationCtrl.prototype.signIn = function() {
72+
this.inProgress = true;
73+
this.status = this.translateService_.getMessage('requestApprovalStatus');
74+
75+
this.gmailService_.signIn().then(goog.bind(function(approved) {
76+
if (approved) {
77+
this.status = null;
78+
this.location_.path('/setup');
79+
} else {
80+
// stay where we are.
81+
this.status = this.translateService_.getMessage(
82+
'approvalUnavailableStatus');
83+
}
84+
}, this)).catch(goog.bind(function(err) {
85+
this.status = err.toString();
86+
}, this)).finally(goog.bind(function() {
87+
this.inProgress = false;
88+
}, this));
89+
};
90+
91+
92+
/**
93+
* Returns the current status.
94+
* @return {?string} The status message.
95+
* @export
96+
*/
97+
AuthorizationCtrl.prototype.getStatus = function() {
98+
return this.status;
99+
};
100+
101+
102+
/**
103+
* Returns whether there's an in-progress operation.
104+
* @return {boolean} returns true if there's an in-progress operation.
105+
* @export
106+
*/
107+
AuthorizationCtrl.prototype.isInProgress = function() {
108+
return this.inProgress;
109+
};
110+
111+
112+
}); // goog.scope
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
div.gmailIcon {
2+
margin: auto;
3+
padding-top: 60px;
4+
padding-bottom: 50px;
5+
height: 50px;
6+
}
7+
h1.authorization-title {
8+
padding-top: 22% !important;
9+
font-weight: bold;
10+
}
11+
12+
div.instructions-format {
13+
text-align: left;
14+
line-height: 1.0 !important;
15+
padding-left: 40px;
16+
padding-right: 40px;
17+
color: #5D5E5E !important;
18+
font-size: 18px !important;
19+
}
20+
21+
authorization-title {
22+
padding-top: 25% !important;
23+
color: black;
24+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<div class="context">
2+
<div class="gmailIcon">
3+
<img src="/assets/img/gmail.png" style="width:40%"/>
4+
</div>
5+
<h1 class="col-xs-12 wizard-title authorization-title">{{'permissions' | translate}}</h1>
6+
<div class="col-xs-10 col-xs-offset-1 lead">{{'authorizationHelp' | translate}}</div>
7+
<div class="row paragraph instructions-format">
8+
<div style="font-weight: bold;">{{'accessEmail' | translate}}</div>
9+
<div class="lead">{{'placeHolderLatin' | translate}}</div>
10+
<div style="font-weight: bold;">{{'deleteEmail' | translate}}</div>
11+
<div>{{'placeHolderLatin' | translate}}</div>
12+
</div>
13+
</div>
14+
<div class="row">
15+
<div class="col-xs-12">
16+
<button ng-disabled="authorizationCtrl.inProgress" class="btn btn-primary btn-focus" data-ng-click="authorizationCtrl.signIn()">{{'openGmailSettings' | translate}}</button>
17+
</div>
18+
</div>
19+
<div class="row top-row-buffer">
20+
<div class="col-xs-12 text-info fade-show">{{authorizationCtrl.status}}</div>
21+
</div>

chrome/pages/getstarted/getstarted-controller.js

+15-3
Original file line numberDiff line numberDiff line change
@@ -26,17 +26,23 @@ goog.scope(function() {
2626
* Redirects the user to the Sign in page after describing the app.
2727
* @param {!angular.$location} $location the angular $location service.
2828
* @param {!e2email.components.translate.TranslateService} translateService
29+
* @param {!e2email.components.gmail.GmailService} gmailService
30+
* the gmail service.
2931
* @constructor
3032
* @ngInject
3133
* @export
3234
*/
3335

3436
e2email.pages.getstarted.GetStartedCtrl = function(
35-
$location, translateService) {
37+
$location, translateService, gmailService) {
3638
/**
3739
* @private {!angular.$location}
3840
*/
3941
this.location_ = $location;
42+
/**
43+
* @private {!e2email.components.gmail.GmailService}
44+
*/
45+
this.gmailService_ = gmailService;
4046
/**
4147
* @private {!e2email.components.translate.TranslateService}
4248
*/
@@ -50,8 +56,14 @@ var GetStartedCtrl = e2email.pages.getstarted.GetStartedCtrl;
5056
* Redirects to the welcome view.
5157
* @export
5258
*/
53-
GetStartedCtrl.prototype.proceed = function() {
54-
this.location_.path(e2email.constants.Location.WELCOME);
59+
GetStartedCtrl.prototype.getEmailAddress = function() {
60+
this.gmailService_.getEmailAddress().then(goog.bind(function(email) {
61+
if (email == null) {
62+
this.location_.path(e2email.constants.Location.WELCOME);
63+
} else {
64+
this.location_.path(e2email.constants.Location.AUTHORIZATION);
65+
}
66+
}, this));
5567
};
5668

5769
}); // goog.scope
+7-2
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
11
div.mainIcon2 {
2-
padding-top: 20px;
2+
padding-top: 30px;
33
margin-bottom: 10px;
44
padding-bottom: 10px;
55
}
66

77
div.intro-title {
88
font-family: inherit;
9-
font-weight: 300;
109
padding-top: 15%;
1110
}
11+
12+
div.getstarted-format {
13+
font-size: 18px;
14+
padding-left: 35px;
15+
padding-right: 35px;
16+
}
+5-7
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,13 @@
1-
<div class="col-xs-10 col-xs-offset-1 col-md-4 col-md-offset-4">
2-
<div class="context">
1+
<div class="context">
32
<div class="mainIcon2">
4-
<img src="/assets/img/encryption.png" style="width: 80%"/>
3+
<img src="/assets/img/encryption.png" style="width: 75%"/>
54
</div>
65
<h1 class="intro-title">{{'endtoendProtection' | translate}}</h1>
76
<div class="row">
8-
<div class="col-xs-12 lead">{{'recipientInfo' | translate}}</div>
9-
</div>
7+
<div class="col-xs-12 lead getstarted-format">{{'recipientInfo' | translate}}</div>
8+
</div>
109
</div>
1110

1211
<div class="row">
13-
<button class="btn btn-primary btn-focus" data-ng-click="getStartedCtrl.proceed()">{{'setupAccount' | translate}}</button>
12+
<button class="btn btn-primary btn-focus" data-ng-click="getStartedCtrl.getEmailAddress()">{{'setupAccount' | translate}}</button>
1413
</div>
15-
</div>

0 commit comments

Comments
 (0)