Make registering and logging in with a threepid work in the webclient.

This commit is contained in:
David Baker 2014-09-03 18:23:56 +01:00
parent d6ecbbdf0a
commit a25d1530ef
5 changed files with 113 additions and 27 deletions

View File

@ -85,7 +85,7 @@ angular.module('MatrixWebClientController', ['matrixService', 'mPresence', 'even
$scope.logout();
});
$scope.updateHeader = function() {
$rootScope.updateHeader = function() {
$scope.user_id = matrixService.config().user_id;
};

View File

@ -84,13 +84,14 @@ angular.module('matrixService', [])
prefix: prefixPath,
// Register an user
register: function(user_name, password) {
register: function(user_name, password, threepidCreds) {
// The REST path spec
var path = "/register";
return doRequest("POST", path, undefined, {
user_id: user_name,
password: password
password: password,
threepidCreds: threepidCreds
});
},
@ -315,9 +316,9 @@ angular.module('matrixService', [])
return doBaseRequest(config.identityServer, "POST", path, {}, data, headers);
},
authEmail: function(clientSecret, tokenId, code) {
authEmail: function(clientSecret, sid, code) {
var path = "/_matrix/identity/api/v1/validate/email/submitToken";
var data = "token="+code+"&sid="+tokenId+"&clientSecret="+clientSecret;
var data = "token="+code+"&sid="+sid+"&clientSecret="+clientSecret;
var headers = {};
headers["Content-Type"] = "application/x-www-form-urlencoded";
return doBaseRequest(config.identityServer, "POST", path, {}, data, headers);
@ -330,6 +331,11 @@ angular.module('matrixService', [])
headers["Content-Type"] = "application/x-www-form-urlencoded";
return doBaseRequest(config.identityServer, "POST", path, {}, data, headers);
},
lookup3pid: function(medium, address) {
var path = "/_matrix/identity/api/v1/lookup?medium="+encodeURIComponent(medium)+"&address="+encodeURIComponent(address);
return doBaseRequest(config.identityServer, "GET", path, {}, undefined, {});
},
uploadContent: function(file) {
var path = "/_matrix/content";

View File

@ -15,8 +15,8 @@
*/
angular.module('LoginController', ['matrixService'])
.controller('LoginController', ['$scope', '$location', 'matrixService', 'eventStreamService',
function($scope, $location, matrixService, eventStreamService) {
.controller('LoginController', ['$scope', '$rootScope', '$location', 'matrixService', 'eventStreamService',
function($scope, $rootScope, $location, matrixService, eventStreamService) {
'use strict';
@ -48,13 +48,39 @@ angular.module('LoginController', ['matrixService'])
$scope.login_type = 'mxid'; // TODO: remember the user's preferred login_type
$scope.login = function() {
matrixService.setConfig({
homeserver: $scope.account.homeserver,
identityServer: $scope.account.identityServer,
});
switch ($scope.login_type) {
case 'mxid':
$scope.login_with_mxid($scope.account.user_id, $scope.account.password);
break;
case 'email':
matrixService.lookup3pid('email', $scope.account.user_id).then(
function(response) {
if (response.data['address'] == undefined) {
$scope.login_error_msg = "Invalid email address / password";
} else {
console.log("Got address "+response.data['mxid']+" for email "+$scope.account.user_id);
$scope.login_with_mxid(response.data['mxid'], $scope.account.password);
}
},
function() {
$scope.login_error_msg = "Couldn't look up email address. Is your identity server set correctly?";
}
);
}
};
$scope.login_with_mxid = function(mxid, password) {
matrixService.setConfig({
homeserver: $scope.account.homeserver,
identityServer: $scope.account.identityServer,
user_id: $scope.account.user_id
});
// try to login
matrixService.login($scope.account.user_id, $scope.account.password).then(
matrixService.login(mxid, password).then(
function(response) {
if ("access_token" in response.data) {
$scope.feedback = "Login successful.";
@ -65,6 +91,7 @@ angular.module('LoginController', ['matrixService'])
access_token: response.data.access_token
});
matrixService.saveConfig();
$rootScope.updateHeader();
eventStreamService.resume();
$location.url("home");
}

View File

@ -15,8 +15,8 @@
*/
angular.module('RegisterController', ['matrixService'])
.controller('RegisterController', ['$scope', '$location', 'matrixService', 'eventStreamService',
function($scope, $location, matrixService, eventStreamService) {
.controller('RegisterController', ['$scope', '$rootScope', '$location', 'matrixService', 'eventStreamService',
function($scope, $rootScope, $location, matrixService, eventStreamService) {
'use strict';
// FIXME: factor out duplication with login-controller.js
@ -30,6 +30,17 @@ angular.module('RegisterController', ['matrixService'])
{
hs_url += ":" + $location.port();
}
var generateClientSecret = function() {
var ret = "";
var chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
for (var i = 0; i < 32; i++) {
ret += chars.charAt(Math.floor(Math.random() * chars.length));
}
return ret;
};
$scope.account = {
homeserver: hs_url,
@ -43,7 +54,6 @@ angular.module('RegisterController', ['matrixService'])
};
$scope.register = function() {
// Set the urls
matrixService.setConfig({
homeserver: $scope.account.homeserver,
@ -59,7 +69,25 @@ angular.module('RegisterController', ['matrixService'])
return;
}
matrixService.register($scope.account.desired_user_id, $scope.account.pwd1).then(
if ($scope.account.email) {
$scope.clientSecret = generateClientSecret();
matrixService.linkEmail($scope.account.email, $scope.clientSecret, 1).then(
function(response) {
$scope.wait_3pid_code = true;
$scope.sid = response.data.sid;
$scope.feedback = "";
},
function(response) {
$scope.feedback = "Couldn't request verification email!";
}
);
} else {
registerWithMxidAndPassword($scope.account.desired_user_id, $scope.account.pwd1);
}
};
$scope.registerWithMxidAndPassword = function(mxid, password, threepidCreds) {
matrixService.register(mxid, password, threepidCreds).then(
function(response) {
$scope.feedback = "Success";
// Update the current config
@ -74,7 +102,7 @@ angular.module('RegisterController', ['matrixService'])
matrixService.saveConfig();
// Update the global scoped used_id var (used in the app header)
$scope.updateHeader();
$rootScope.updateHeader();
eventStreamService.resume();
@ -87,15 +115,32 @@ angular.module('RegisterController', ['matrixService'])
$location.url("home");
},
function(error) {
console.trace("Registration error: "+error);
if (error.data) {
if (error.data.errcode === "M_USER_IN_USE") {
$scope.feedback = "Username already taken.";
$scope.reenter_username = true;
}
}
else if (error.status === 0) {
$scope.feedback = "Unable to talk to the server.";
}
});
}
$scope.verifyToken = function() {
matrixService.authEmail($scope.clientSecret, $scope.sid, $scope.account.threepidtoken).then(
function(response) {
if (!response.data.success) {
$scope.feedback = "Unable to verify code.";
} else {
$scope.registerWithMxidAndPassword($scope.account.desired_user_id, $scope.account.pwd1, [{'sid':$scope.sid, 'clientSecret':$scope.clientSecret, 'idServer': $scope.account.identityServer.split('//')[1]}]);
}
},
function(error) {
$scope.feedback = "Unable to verify code.";
}
);
};
}]);

View File

@ -12,26 +12,34 @@
<div style="text-align: center">
<br/>
<input id="email" size="32" type="text" ng-focus="true" ng-model="account.email" placeholder="Email address (optional)" style="display: none"/>
<div class="smallPrint" style="display: none;">Specifying an email address lets other users find you on Matrix more easily,<br/>
and gives you a way to reset your password</div>
<input id="desired_user_id" size="32" type="text" ng-model="account.desired_user_id" placeholder="Matrix ID (e.g. bob)"/>
<br/>
<input id="pwd1" size="32" type="password" ng-model="account.pwd1" placeholder="Type a password"/>
<br/>
<input id="pwd2" size="32" type="password" ng-model="account.pwd2" placeholder="Confirm your password"/>
<br/>
<input id="displayName" size="32" type="text" ng-model="account.displayName" placeholder="Display name (e.g. Bob Obson)"/>
<br/>
<br/>
<input ng-show="!wait_3pid_code" id="email" size="32" type="text" ng-focus="true" ng-model="account.email" placeholder="Email address (optional)"/>
<div ng-show="!wait_3pid_code" class="smallPrint">Specifying an email address lets other users find you on Matrix more easily,<br/>
and will give you a way to reset your password in the future</div>
<span ng-show="reenter_username">Choose another username:</span>
<input ng-show="!wait_3pid_code || reenter_username" id="desired_user_id" size="32" type="text" ng-model="account.desired_user_id" placeholder="Matrix ID (e.g. bob)"/>
<br ng-show="!wait_3pid_code" />
<input ng-show="!wait_3pid_code" id="pwd1" size="32" type="password" ng-model="account.pwd1" placeholder="Type a password"/>
<br ng-show="!wait_3pid_code" />
<input ng-show="!wait_3pid_code" id="pwd2" size="32" type="password" ng-model="account.pwd2" placeholder="Confirm your password"/>
<br ng-show="!wait_3pid_code" />
<input ng-show="!wait_3pid_code" id="displayName" size="32" type="text" ng-model="account.displayName" placeholder="Display name (e.g. Bob Obson)"/>
<br ng-show="!wait_3pid_code" />
<br ng-show="!wait_3pid_code" />
<button ng-click="register()" ng-disabled="!account.desired_user_id || !account.homeserver || !account.pwd1 || !account.pwd2 || account.pwd1 !== account.pwd2">Sign up</button>
<button ng-show="!wait_3pid_code" ng-click="register()" ng-disabled="!account.desired_user_id || !account.homeserver || !account.pwd1 || !account.pwd2 || account.pwd1 !== account.pwd2">Sign up</button>
<div ng-show="wait_3pid_code">
<span>Please enter the verification code sent to {{ account.email }}</span><br />
<input id="threepidtoken" size="32" type="text" ng-focus="true" ng-model="account.threepidtoken" placeholder="Verification Code"/><br />
<button ng-click="verifyToken()" ng-disabled="!account.threepidtoken">Validate</button>
</div>
<br/><br/>
</div>
<div class="feedback">{{ feedback }} {{ login_error_msg }}</div>
<div id="serverConfig">
<div id="serverConfig" ng-show="!wait_3pid_code">
<label for="homeserver">Home Server:</label>
<input id="homeserver" size="32" type="text" ng-model="account.homeserver" placeholder="URL (e.g. http://matrix.org:8080)"/>
<div class="smallPrint">Your home server stores all your conversation and account data.</div>