jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Implement setting new password

Browse Source
This commit is contained in:
Johannes Zellner
2020-02-04 16:48:11 +01:00
parent 0762b337b8
commit 4a8a52a0c7
2 changed files with 100 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/js/login.js
+42 -2
View File
@@ -10,15 +10,26 @@ app.controller('LoginController', ['$scope', '$http', function ($scope, $http) {
var search = decodeURIComponent(window.location.search).slice(1).split('&').map(function (item) { return item.indexOf('=') === -1 ? [item, true] : [item.slice(0, item.indexOf('=')), item.slice(item.indexOf('=')+1)]; }).reduce(function (o, k) { o[k[0]] = k[1]; return o; }, {});
$scope.initialized = false;
$scope.mode = search.passwordReset ? 'passwordReset' : 'login';
$scope.mode = '';
$scope.busy = false;
$scope.error = false;
$scope.username = '';
$scope.password = '';
$scope.totpToken = '';
$scope.passwordResetIdentifier = '';
$scope.newPassword = '';
$scope.newPasswordRepeat = '';
var API_ORIGIN = '<%= oauth.apiOrigin %>' || window.location.origin;
if (search.passwordReset) {
$scope.mode = 'passwordReset';
} else if (search.resetToken) {
$scope.mode = 'newPassword';
setTimeout(function () { $('#inputNewPassword').focus(); }, 200);
} else {
$scope.mode = 'login';
}
$scope.onLogin = function () {
$scope.busy = true;
$scope.error = false;
@@ -58,7 +69,36 @@ app.controller('LoginController', ['$scope', '$http', function ($scope, $http) {
$scope.mode = 'passwordResetDone';
}
$http.post(API_ORIGIN + '/api/v1/cloudron/password_reset', data).success(done).error(done);
$http.post(API_ORIGIN + '/api/v1/cloudron/password_reset_request', data).success(done).error(done);
};
$scope.onNewPassword = function () {
$scope.busy = true;
var data = {
resetToken: search.resetToken,
password: $scope.newPassword
};
function error(status) {
console.log('error', status)
$scope.busy = false;
if (status === 401) $scope.error = 'Invalid reset token';
else if (status === 409) $scope.error = 'Ask your admin for an invite link first';
else $scope.error = 'Unknown error';
}
$http.post(API_ORIGIN + '/api/v1/cloudron/password_reset', data).success(function (data, status) {
if (status !== 202) return error(status);
// set token to autologin
localStorage.token = data.accessToken;
$scope.mode = 'newPasswordDone';
}).error(function (data, status) {
error(status);
});
};
$scope.showPasswordReset = function () {
src/login.html
+58 -1
View File
@@ -96,7 +96,7 @@
<input type="text" class="form-control" id="inputPasswordResetIdentifier" name="passwordResetIdentifier" ng-model="passwordResetIdentifier" ng-disabled="busy" autofocus required>
</div>
<br/>
<button class="btn btn-primary btn-outline pull-right" type="submit" value="Reset" ng-disabled="busy || passwordResetForm.$invalid"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> Reset</button>
<button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || passwordResetForm.$invalid"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> Reset</button>
</form>
<a ng-href="" class="hand" ng-click="showLogin()">Back to login</a>
</div>
@@ -118,6 +118,63 @@
</div>
</div>
<div class="layout-content" ng-show="mode === 'newPassword'">
<div class="card" style="padding: 20px; margin-top: 100px; max-width: 620px;">
<div class="row">
<div class="col-md-12" style="text-align: center;">
<img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
<br/>
<h2>Set new Password</h2>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<h4 class="has-error" ng-show="error">{{ error }}</h4>
</div>
</div>
<br/>
<div class="row">
<div class="col-md-12">
<form name="newPasswordForm" ng-submit="onNewPassword()">
<input type="password" style="display: none;"/>
<div class="form-group" ng-class="{ 'has-error': newPasswordForm.newPassword.$dirty && newPasswordForm.newPassword.$invalid }">
<label class="control-label" for="inputNewPassword">New Password</label>
<div class="control-label" ng-show="newPasswordForm.newPassword.$dirty && newPasswordForm.newPassword.$invalid">
<small ng-show="newPasswordForm.newPassword.$dirty && newPasswordForm.newPassword.$invalid">Password must be atleast 8 characters</small>
</div>
<input type="password" class="form-control" id="inputNewPassword" ng-model="newPassword" name="newPassword" ng-pattern="/^.{8,30}$/" autofocus required>
</div>
<div class="form-group" ng-class="{ 'has-error': newPasswordForm.newPasswordRepeat.$dirty && (newPassword !== newPasswordRepeat) }">
<label class="control-label" for="inputNewPasswordRepeat">Repeat Password</label>
<div class="control-label" ng-show="newPasswordForm.newPasswordRepeat.$dirty && (newPassword !== newPasswordRepeat)">
<small ng-show="newPasswordForm.newPasswordRepeat.$dirty && (newPassword !== newPasswordRepeat)">Passwords don't match</small>
</div>
<input type="password" class="form-control" id="inputNewPasswordRepeat" ng-model="newPasswordRepeat" name="newPasswordRepeat" required>
</div>
<br/>
<button class="btn btn-primary btn-outline pull-right" type="submit" ng-disabled="busy || newPasswordForm.$invalid || newPassword !== newPasswordRepeat"><i class="fa fa-circle-notch fa-spin" ng-show="busy"></i> Submit</button>
</form>
<a ng-href="" class="hand" ng-click="showLogin()">Back to login</a>
</div>
</div>
</div>
</div>
<div class="layout-content" ng-show="mode === 'newPasswordDone'">
<div class="card" style="padding: 20px; margin-top: 100px; max-width: 620px;">
<div class="row">
<div class="col-md-12" style="text-align: center;">
<img width="128" height="128" style="margin-top: -84px" src="<%= apiOrigin %>/api/v1/cloudron/avatar"/>
<br/>
<h2>New Password set</h2>
<br/>
<a href="/" class="btn btn-primary">Open Dashboard</a>
</div>
</div>
</div>
</div>
<footer class="text-center">
<span class="text-muted">&copy; 2016-20 <a href="https://cloudron.io" target="_blank">Cloudron</a></span>
</footer>