Skip to content
This repository was archived by the owner on Jul 10, 2019. It is now read-only.

Commit 72092b3

Browse files
author
Tankred Hase
committed
Merge pull request #114 from whiteout-io/dev/WO-491
Add STARTTLS, add Outlook.com, Web.de, Gmx.net to list
2 parents 4d62c07 + 04b6c8b commit 72092b3

12 files changed

+373
-63
lines changed

‎src/img/gmx_logo.jpg

8.75 KB
Loading

‎src/img/webde_logo.jpg

13.8 KB
Loading

‎src/js/app-config.js

+66-6
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/js/controller/add-account.js

+18
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,24 @@ define(function(require) {
3838
});
3939
};
4040

41+
$scope.connectToOutlook = function() {
42+
$location.path('/login-set-credentials').search({
43+
provider: 'outlook'
44+
});
45+
};
46+
47+
$scope.connectToGmx = function() {
48+
$location.path('/login-set-credentials').search({
49+
provider: 'gmx'
50+
});
51+
};
52+
53+
$scope.connectToWebde = function() {
54+
$location.path('/login-set-credentials').search({
55+
provider: 'webde'
56+
});
57+
};
58+
4159
$scope.connectOther = function() {
4260
$location.path('/login-set-credentials').search({
4361
provider: 'custom'

‎src/js/controller/login-set-credentials.js

+34-6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
define(function(require) {
22
'use strict';
33

4+
var ENCRYPTION_METHOD_NONE = 0;
5+
var ENCRYPTION_METHOD_STARTTLS = 1;
6+
var ENCRYPTION_METHOD_TLS = 2;
7+
48
var appCtrl = require('js/app-controller'),
59
config = require('js/app-config').config,
610
ImapClient = require('imap-client'),
@@ -24,17 +28,34 @@ define(function(require) {
2428
// use non-editable smtp and imap presets for provider
2529
$scope.smtpHost = config[provider].smtp.host;
2630
$scope.smtpPort = config[provider].smtp.port;
27-
$scope.smtpSecure = config[provider].smtp.secure;
2831
$scope.smtpCert = config[provider].smtp.ca;
2932
$scope.smtpPinned = config[provider].smtp.pinned;
33+
34+
if (config[provider].smtp.secure && !config[provider].smtp.ignoreTLS) {
35+
$scope.smtpEncryption = ENCRYPTION_METHOD_TLS;
36+
} else if (!config[provider].smtp.secure && !config[provider].smtp.ignoreTLS) {
37+
$scope.smtpEncryption = ENCRYPTION_METHOD_STARTTLS;
38+
} else {
39+
$scope.smtpEncryption = ENCRYPTION_METHOD_NONE;
40+
}
41+
3042
$scope.imapHost = config[provider].imap.host;
3143
$scope.imapPort = config[provider].imap.port;
32-
$scope.imapSecure = config[provider].imap.secure;
3344
$scope.imapCert = config[provider].imap.ca;
3445
$scope.imapPinned = config[provider].imap.pinned;
46+
47+
if (config[provider].imap.secure && !config[provider].imap.ignoreTLS) {
48+
$scope.imapEncryption = ENCRYPTION_METHOD_TLS;
49+
} else if (!config[provider].imap.secure && !config[provider].imap.ignoreTLS) {
50+
$scope.imapEncryption = ENCRYPTION_METHOD_STARTTLS;
51+
} else {
52+
$scope.imapEncryption = ENCRYPTION_METHOD_NONE;
53+
}
3554
}
3655

3756
$scope.test = function(imapClient, smtpClient) {
57+
var imapEncryption = parseInt($scope.imapEncryption, 10);
58+
var smtpEncryption = parseInt($scope.smtpEncryption, 10);
3859
$scope.credentialsIncomplete = false;
3960
$scope.connectionError = false;
4061
$scope.smtpOk = undefined;
@@ -48,7 +69,8 @@ define(function(require) {
4869
var imap = imapClient || new ImapClient({
4970
host: $scope.imapHost.toLowerCase(),
5071
port: $scope.imapPort,
51-
secure: $scope.imapSecure,
72+
secure: imapEncryption === ENCRYPTION_METHOD_TLS,
73+
ignoreTLS: imapEncryption === ENCRYPTION_METHOD_NONE,
5274
ca: $scope.imapCert,
5375
auth: {
5476
user: $scope.username || $scope.emailAddress,
@@ -70,7 +92,8 @@ define(function(require) {
7092
};
7193

7294
var smtp = smtpClient || new SmtpClient($scope.smtpHost.toLowerCase(), $scope.smtpPort, {
73-
useSecureTransport: $scope.smtpSecure,
95+
useSecureTransport: smtpEncryption === ENCRYPTION_METHOD_TLS,
96+
ignoreTLS: smtpEncryption === ENCRYPTION_METHOD_NONE,
7497
ca: $scope.smtpCert,
7598
auth: {
7699
user: $scope.username || $scope.emailAddress,
@@ -124,6 +147,9 @@ define(function(require) {
124147
}
125148

126149
function login() {
150+
var imapEncryption = parseInt($scope.imapEncryption, 10);
151+
var smtpEncryption = parseInt($scope.smtpEncryption, 10);
152+
127153
auth.setCredentials({
128154
provider: provider,
129155
emailAddress: $scope.emailAddress,
@@ -133,14 +159,16 @@ define(function(require) {
133159
imap: {
134160
host: $scope.imapHost.toLowerCase(),
135161
port: $scope.imapPort,
136-
secure: $scope.imapSecure,
162+
secure: imapEncryption === ENCRYPTION_METHOD_TLS,
163+
ignoreTLS: imapEncryption === ENCRYPTION_METHOD_NONE,
137164
ca: $scope.imapCert,
138165
pinned: !!$scope.imapPinned
139166
},
140167
smtp: {
141168
host: $scope.smtpHost.toLowerCase(),
142169
port: $scope.smtpPort,
143-
secure: $scope.smtpSecure,
170+
secure: smtpEncryption === ENCRYPTION_METHOD_TLS,
171+
ignoreTLS: smtpEncryption === ENCRYPTION_METHOD_NONE,
144172
ca: $scope.smtpCert,
145173
pinned: !!$scope.smtpPinned
146174
}

‎src/sass/components/_input.scss

+3-4
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
.input-text {
22
background-color: white;
3-
border-width: 1px;
4-
border-style: solid;
5-
border-color: $color-grey-lighter;
3+
border: 1px solid $color-grey-lighter;
64
color: $color-grey;
75
font-size: $font-size-base;
86
padding: 8px 10px;
@@ -23,4 +21,5 @@
2321
padding: 0;
2422
color: red;
2523
font-size: em(13);
26-
}
24+
}
25+

‎src/sass/views/_add-account.scss

+38
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,44 @@
9595
}
9696
}
9797

98+
&.outlook {
99+
div {
100+
width: 256px;
101+
margin: 0 auto;
102+
padding: 13px 0;
103+
104+
img {
105+
width: 100%;
106+
}
107+
}
108+
}
109+
110+
&.gmx {
111+
div {
112+
width: 115px;
113+
margin: 0 auto;
114+
padding: 13px 0;
115+
116+
img {
117+
width: 115px;
118+
height: 37px;
119+
}
120+
}
121+
}
122+
123+
&.webde {
124+
div {
125+
width: 137px;
126+
margin: 0 auto;
127+
padding: 17px 0;
128+
129+
img {
130+
width: 137px;
131+
height: 31px;
132+
}
133+
}
134+
}
135+
98136
&.other {
99137
h3 {
100138
margin: 0;

‎src/sass/views/_login.scss

+30-17
Original file line numberDiff line numberDiff line change
@@ -163,27 +163,40 @@
163163
text-decoration: none;
164164
}
165165

166-
@include respond-to(desktop) {
167-
input[type="text"],
168-
input[type="password"],
169-
input[type="file"] {
170-
width: 100%;
171-
}
172-
}
173-
174166
.details {
175-
div {
176-
margin: 0;
177-
}
167+
fieldset {
168+
margin: 0 0 10px 0;
178169

179-
label,
180-
input[type="text"],
181-
input[type="number"] {
182-
width: auto;
183-
display: inline-block;
170+
select {
171+
width: 100%;
172+
}
184173

185-
&.username {
174+
div {
186175
width: 100%;
176+
margin: 0;
177+
display: flex;
178+
179+
input[type="text"] {
180+
flex: 2;
181+
}
182+
183+
input[type="number"] {
184+
flex: 1;
185+
margin-right: 0;
186+
}
187+
}
188+
189+
label {
190+
position:relative
191+
}
192+
label:after {
193+
content: '<>';
194+
color: $color-grey-dark;
195+
transform:rotate(90deg);
196+
right: 8px;
197+
top: -3px;
198+
position:absolute;
199+
pointer-events:none;
187200
}
188201
}
189202
}

‎src/tpl/add-account.html

+44-5
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,27 @@
33
<h1>Select email account</h1>
44

55
<ul>
6-
<li class="google enabled" popover="#google-info" wo-touch="connectToGoogle()">
7-
<div><img src="img/google_logo.png" alt="Google Mail"></div>
8-
</li>
96
<li class="whiteout disabled" popover="#whiteout-info" wo-touch="onError({message:'Whiteout Mailbox coming soon!', sync:true})">
107
<div><img src="img/whiteout_logo.svg" alt="Whiteout Mailbox"></div>
118
</li>
12-
<li class="tonline" popover="#tonline-info" wo-touch="connectToTonline()">
13-
<div><img src="img/tonline_logo.jpg" alt="T-Online"></div>
9+
<li class="google" popover="#google-info" wo-touch="connectToGoogle()">
10+
<div><img src="img/google_logo.png" alt="Google Mail"></div>
11+
</li>
12+
<li class="outlook" popover="#outlook-info" wo-touch="connectToOutlook()">
13+
<div><img src="img/outlook_logo.jpg" alt="Outlook.com"></div>
1414
</li>
1515
<li class="yahoo" popover="#yahoo-info" wo-touch="connectToYahoo()">
1616
<div><img src="img/yahoo_logo.png" alt="Yahoo! Mail"></div>
1717
</li>
18+
<li class="gmx" popover="#gmx-info" wo-touch="connectToGmx()">
19+
<div><img src="img/gmx_logo.jpg" alt="GMX.net"></div>
20+
</li>
21+
<li class="webde" popover="#webde-info" wo-touch="connectToWebde()">
22+
<div><img src="img/webde_logo.jpg" alt="Web.de"></div>
23+
</li>
24+
<li class="tonline" popover="#tonline-info" wo-touch="connectToTonline()">
25+
<div><img src="img/tonline_logo.jpg" alt="T-Online"></div>
26+
</li>
1827
<li class="other" popover="#custom-info" wo-touch="connectOther()">
1928
<h3>Custom server...</h3>
2029
</li>
@@ -63,6 +72,36 @@ <h3>Custom server...</h3>
6372
</div>
6473
</div><!--/.popover-->
6574

75+
<div id="outlook-info" class="popover right desktop-only" ng-controller="PopoverCtrl">
76+
<div class="arrow"></div>
77+
<div class="popover-title"><b>Outlook.com Account</b></div>
78+
<div class="popover-content">
79+
<p>Connect Whiteout Mail to your Outlook.com account.</p>
80+
<p>Encrypted and cleartext messages are stored on Microsoft's servers.</p>
81+
<p>Your emails and password remain on your device and are never sent to our servers.</p>
82+
</div>
83+
</div><!--/.popover-->
84+
85+
<div id="gmx-info" class="popover right desktop-only" ng-controller="PopoverCtrl">
86+
<div class="arrow"></div>
87+
<div class="popover-title"><b>GMX.net Account</b></div>
88+
<div class="popover-content">
89+
<p>Connect Whiteout Mail to your GMX.net account.</p>
90+
<p>Encrypted and cleartext messages are stored on GMX's servers.</p>
91+
<p>Your emails and password remain on your device and are never sent to our servers.</p>
92+
</div>
93+
</div><!--/.popover-->
94+
95+
<div id="webde-info" class="popover right desktop-only" ng-controller="PopoverCtrl">
96+
<div class="arrow"></div>
97+
<div class="popover-title"><b>Web.de Account</b></div>
98+
<div class="popover-content">
99+
<p>Connect Whiteout Mail to your Web.de account.</p>
100+
<p>Encrypted and cleartext messages are stored on Web.de's servers.</p>
101+
<p>Your emails and password remain on your device and are never sent to our servers.</p>
102+
</div>
103+
</div><!--/.popover-->
104+
66105
<div id="custom-info" class="popover right desktop-only" ng-controller="PopoverCtrl">
67106
<div class="arrow"></div>
68107
<div class="popover-title"><b>Custom server</b></div>

‎src/tpl/login-set-credentials.html

+31-13
Original file line numberDiff line numberDiff line change
@@ -24,19 +24,37 @@
2424
<div class='details' ng-show='showDetails'>
2525
<input ng-hide="useOAuth" class="input-text username" type="text" ng-model="username" placeholder="User (optional)"></input>
2626

27-
<div class="settings">
28-
<input required ng-disabled="hasProviderPreset" class="input-text" type="text" ng-model="imapHost" placeholder="IMAP server" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"></input>
29-
<input required ng-disabled="hasProviderPreset" class="input-text" type="number" ng-model="imapPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+"></input>
30-
<input ng-disabled="hasProviderPreset" class="input-checkbox" type="checkbox" ng-model="imapSecure" id="cb-imapSecure" checked>
31-
<label for="cb-imapSecure">TLS</label>
32-
</div><!--/.settings-->
33-
34-
<div class="settings">
35-
<input required ng-disabled="hasProviderPreset" class="input-text" type="text" ng-model="smtpHost" placeholder="SMTP server" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"></input>
36-
<input required ng-disabled="hasProviderPreset" class="input-text" type="number" ng-model="smtpPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+"></input>
37-
<input ng-disabled="hasProviderPreset" class="input-checkbox" type="checkbox" ng-model="smtpSecure" id="cb-smtpSecure" checked>
38-
<label for="cb-smtpSecure">TLS</label>
39-
</div><!--/.settings-->
27+
<fieldset>
28+
<legend>IMAP</legend>
29+
<div>
30+
<input required ng-disabled="hasProviderPreset" class="input-text" type="text" ng-model="imapHost" placeholder="Host" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"></input>
31+
<input required ng-disabled="hasProviderPreset" class="input-text" type="number" ng-model="imapPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+"></input>
32+
</div>
33+
<label>
34+
<select class="input-text" required ng-disabled="hasProviderPreset" ng-model="imapEncryption">
35+
<option value="" disabled selected style="display:none">Encryption method</option>
36+
<option value="2">TLS</option>
37+
<option value="1">STARTTLS</option>
38+
<option value="0">None</option>
39+
</select>
40+
</label>
41+
</fieldset>
42+
43+
<fieldset>
44+
<legend>SMTP</legend>
45+
<div>
46+
<input required ng-disabled="hasProviderPreset" class="input-text" type="text" ng-model="smtpHost" placeholder="Host" pattern="^(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])\.){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$|^(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9\-]*[a-zA-Z0-9])\.)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9\-]*[A-Za-z0-9])$"></input>
47+
<input required ng-disabled="hasProviderPreset" class="input-text" type="number" ng-model="smtpPort" placeholder="Port" min="0" max="65535" step="1" pattern="\d+"></input>
48+
</div>
49+
<label>
50+
<select class="input-text" required ng-disabled="hasProviderPreset" ng-model="smtpEncryption">
51+
<option value="" disabled selected style="display:none">Encryption method</option>
52+
<option value="2">TLS</option>
53+
<option value="1">STARTTLS</option>
54+
<option value="0">None</option>
55+
</select>
56+
</label>
57+
</fieldset>
4058
</div><!--/.details-->
4159

4260
<div class="working" ng-show="busy">

0 commit comments

Comments
 (0)