[Major] Implemented password change request

This commit is contained in:
Robert von Burg 2021-02-23 12:40:10 +01:00
parent 0ac8e74fad
commit 7f729b2896
3 changed files with 83 additions and 62 deletions

View File

@ -1,7 +1,7 @@
{
"name": "strolch-wc-auth",
"description": "Strolch WebComponent Auth",
"version": "0.8.2",
"version": "0.9.0",
"authors": ["Robert von Burg"],
"keywords": [
"strolch",

View File

@ -7,6 +7,7 @@
"reset": "Reset",
"passwordReset": "Password Reset",
"passwordResetDesc": "To reset your password, enter your username",
"passwordChangeRequest": "A password change has been requested",
"passwordResetInitiated": "The reset has been initiated for your account. Please check your e-mail inbox as there should be an e-mail with a reset code. The code in the e-mail will be valid for one hour.",
"passwordResetCode": "Please enter the code here:",
"passwordResetNew": "Type in a new password and please repeat it",
@ -46,6 +47,7 @@
"reset": "Zurücksetzen",
"passwordReset": "Passwort zurücksetzen",
"passwordResetDesc": "Geben Sie Ihren Nutzernamen ein, um ihr Passwort zurückzusetzen",
"passwordChangeRequest": "Das Passwort muss geändert werden",
"passwordResetInitiated": "Der Passwort-Reset wurde eingeleitet. Bitte überprüfen Sie ihren E-Mail Eingang, dieser sollte nun eine E-Mail mit dem Bestätigungs-Code enthalten. Dieser ist für eine Stunde gültig.",
"passwordResetCode": "Bitte geben Sie den Code hier ein:",
"passwordResetNew": "Geben Sie ein neues Passwort ein und wiederholen Sie es",

View File

@ -55,19 +55,19 @@
<div id="authForm" class="centered">
<iron-a11y-keys id="a11y" keys="enter" on-keys-pressed="_submitForm"></iron-a11y-keys>
<paper-card heading="{{localize('login')}}">
<paper-card heading="[[localize('login')]]">
<div class="card-content">
<p>{{localize('pleaseLogin', 'appTitle', appTitle)}}</p>
<p>[[localize('pleaseLogin', 'appTitle', appTitle)]]</p>
<paper-input id="usernameInput"
value="{{username}}"
label="{{localize('username')}}"
label="[[localize('username')]]"
required
autofocus="true"
auto-validate></paper-input>
<paper-input id="passwordInput"
value="{{password}}"
label="{{localize('password')}}"
label="[[localize('password')]]"
required
type="password"
on-focus="onFocus"
@ -85,84 +85,89 @@
</div>
<div class="card-actions">
<paper-button on-tap="_showResetForm">{{localize('reset')}}</paper-button>
<paper-button on-tap="_submitForm">{{localize('login')}}</paper-button>
<paper-button on-tap="_showResetForm">[[localize('reset')]]</paper-button>
<paper-button on-tap="_submitForm">[[localize('login')]]</paper-button>
</div>
</paper-card>
</div>
<div id="initiateResetForm" class="centered" hidden>
<iron-a11y-keys id="a11y" keys="enter" on-keys-pressed="_initiateReset"></iron-a11y-keys>
<paper-card heading="{{localize('passwordReset')}}">
<paper-card heading="[[localize('passwordReset')]]">
<div class="card-content">
<p>{{localize('passwordResetDesc')}}</p>
<p>[[localize('passwordResetDesc')]]</p>
<paper-input id="usernameResetInput"
value="{{username}}"
label="{{localize('username')}}"
label="[[localize('username')]]"
required
autofocus="true"
auto-validate></paper-input>
</div>
<div class="card-actions">
<paper-button on-tap="_cancelReset">{{localize('cancel')}}</paper-button>
<paper-button on-tap="_initiateReset">{{localize('reset')}}</paper-button>
<paper-button on-tap="_cancelReset">[[localize('cancel')]]</paper-button>
<paper-button on-tap="_initiateReset">[[localize('reset')]]</paper-button>
</div>
</paper-card>
</div>
<div id="resetInitiated" class="centered" hidden>
<iron-a11y-keys id="a11y" keys="enter" on-keys-pressed="_validateChallenge"></iron-a11y-keys>
<paper-card heading="{{localize('passwordReset')}}">
<paper-card heading="[[localize('passwordReset')]]">
<div class="card-content">
<p>{{localize('passwordResetInitiated')}}</p>
<p>{{localize('passwordResetCode')}}</p>
<p>[[localize('passwordResetInitiated')]]</p>
<p>[[localize('passwordResetCode')]]</p>
<paper-input id="codeInput"
bind-value="{{code}}"
label="{{localize('code')}}"
label="[[localize('code')]]"
required
autofocus="true"
auto-validate></paper-input>
</div>
<div class="card-actions">
<paper-button on-tap="_validateChallenge">{{localize('send')}}</paper-button>
<paper-button on-tap="_validateChallenge">[[localize('send')]]</paper-button>
</div>
</paper-card>
</div>
<div id="resetForm" class="centered" hidden>
<iron-a11y-keys id="a11y" keys="enter" on-keys-pressed="_doReset"></iron-a11y-keys>
<paper-card heading="{{localize('passwordReset')}}">
<paper-card heading="[[localize('passwordReset')]]">
<div class="card-content">
<p>{{localize('passwordResetNew')}}</p>
<template is="dom-if" if="[[isPasswordChangeRequested]]">
<p>[[localize('passwordChangeRequest')]]</p>
</template>
<template is="dom-if" if="[[!isPasswordChangeRequested]]">
<p>[[localize('passwordResetNew')]]</p>
</template>
<paper-input id="password1Input"
bind-value="{{password1}}"
label="{{localize('password')}}"
label="[[localize('password')]]"
required
type="password"
on-focus="onFocus"
auto-validate></paper-input>
<paper-input id="password2Input"
bind-value="{{password2}}"
label="{{localize('repeat')}}"
label="[[localize('repeat')]]"
required
type="password"
on-focus="onFocus"
auto-validate></paper-input>
</div>
<div class="card-actions">
<paper-button on-tap="_doReset">{{localize('reset')}}</paper-button>
<paper-button on-tap="_doReset">[[localize('reset')]]</paper-button>
</div>
</paper-card>
</div>
<div id="passwordResetDone" class="centered" hidden>
<iron-a11y-keys id="a11y" keys="enter" on-keys-pressed="_toLogin"></iron-a11y-keys>
<paper-card heading="{{localize('passwordReset')}}">
<paper-card heading="[[localize('passwordReset')]]">
<div class="card-content">
<p>{{localize('passwordResetDone')}}</p>
<p>[[localize('passwordResetDone')]]</p>
</div>
<div class="card-actions">
<paper-button on-tap="_showLoginForm">{{localize('login')}}</paper-button>
<paper-button id="backToLoginBtn" on-tap="_showLoginForm">[[localize('login')]]</paper-button>
</div>
</paper-card>
</div>
@ -256,6 +261,10 @@
},
dlgTitle: {
type: String
},
isPasswordChangeRequested: {
type: Boolean,
value: false
}
},
@ -292,15 +301,14 @@
console.log("Validating session...");
}
var that = this;
setTimeout(function () {
that.$.usernameInput.focus();
}, 100);
this.$.usernameInput.focus();
}.bind(this), 100);
},
sessionValidated: function (data) {
sessionValidated: function (e) {
console.log("Session validated.");
var userConfig = data.detail.response;
var userConfig = e.detail.response;
Strolch.setUserConfig(userConfig);
Strolch.sessionVerified = true;
this.fire('strolch-session-valid', {
@ -324,8 +332,6 @@
var keepAliveDays = keepAliveMinutes / 60 / 24;
var delayMin = 14;
var that = this;
if (keepAliveMinutes > 1440) {
// more than a day
@ -340,8 +346,8 @@
// check again in delayMin min
console.log("Keep alive is " + keepAliveDays + " days and expiring in the future. Delaying refresh for " + delayMin + "m...");
setTimeout(function () {
that.handleKeepAlive(Strolch.getUserConfig());
}, delayMin * 60 * 1000);
this.handleKeepAlive(Strolch.getUserConfig());
}.bind(this), delayMin * 60 * 1000);
}
} else if (keepAliveMinutes < 15) {
@ -356,8 +362,8 @@
// check again in delayMin
console.log("Keep alive is " + keepAliveMinutes + " minutes and expiring in " + expiryMin + "m. Delaying refresh for " + delayMin + "m...");
setTimeout(function () {
that.handleKeepAlive(Strolch.getUserConfig());
}, delayMin * 60 * 1000);
this.handleKeepAlive(Strolch.getUserConfig());
}.bind(this), delayMin * 60 * 1000);
} else {
// less than 15 min
@ -378,12 +384,12 @@
console.log('No response handler defined!');
},
_handleAjaxError: function (data) {
_handleAjaxError: function (e) {
var dlgText;
if (data.detail.request.response) {
dlgText = data.detail.request.response.msg;
if (e.detail.request.response) {
dlgText = e.detail.request.response.msg;
} else {
dlgText = data.detail.error;
dlgText = e.detail.error;
}
this.showError(this.dlgTitle, dlgText);
@ -392,7 +398,7 @@
logout: function () {
console.log('Logging out...');
this._ajaxResponse = function (data) {
this._ajaxResponse = function (e) {
console.log('Logged out.');
Strolch.clearStorageData();
};
@ -439,10 +445,19 @@
}
console.log('Authenticating...');
this._ajaxResponse = function (data) {
this._ajaxResponse = function (e) {
if (e.detail.response.usage === "set-password") {
this.authToken = e.detail.response.authToken;
this.isPasswordChangeRequested = true;
this._hideAll();
this.$.resetForm.hidden = false;
this.$.password1Input.focus();
return;
}
console.log('Logged in.');
Strolch.setAuthToken(data.detail.response.authToken);
Strolch.setUserConfig(data.detail.response);
Strolch.setAuthToken(e.detail.response.authToken);
Strolch.setUserConfig(e.detail.response);
location.reload();
};
this.dlgTitle = this.localize('authenticationFailed');
@ -451,6 +466,7 @@
password: btoa(unescape(encodeURIComponent(this.password))),
keepAlive: this.keepAlive
};
this.password = "";
this.$.ajaxAuth.url = this.basePath + 'rest/strolch/authentication';
this.$.ajaxAuth.method = 'POST';
this.$.ajaxAuth.generateRequest();
@ -467,11 +483,13 @@
_showResetForm: function () {
this._hideAll();
this.$.initiateResetForm.hidden = false;
this.$.usernameResetInput.focus();
},
_showLoginForm: function () {
this._hideAll();
this.$.authForm.hidden = false;
this.$.passwordInput.inputElement.select();
},
_cancelReset: function () {
@ -485,11 +503,10 @@
console.log('Initiating reset...');
var that = this;
this._ajaxResponse = function (data) {
that._hideAll();
that.$.resetInitiated.hidden = false;
that.$.codeInput.focus();
this._hideAll();
this.$.resetInitiated.hidden = false;
this.$.codeInput.focus();
};
this.dlgTitle = this.localize('resetFailed');
@ -508,12 +525,11 @@
console.log('Validating challenge...');
var that = this;
this._ajaxResponse = function (data) {
that.authToken = data.detail.response.authToken;
that._hideAll();
that.$.resetForm.hidden = false;
that.$.password1Input.focus();
this.authToken = data.detail.response.authToken;
this._hideAll();
this.$.resetForm.hidden = false;
this.$.password1Input.focus();
};
this.dlgTitle = this.localize('resetFailed');
@ -540,10 +556,10 @@
console.log('Doing reset...');
var that = this;
this._ajaxResponse = function (data) {
that._hideAll();
that.$.passwordResetDone.hidden = false;
this._ajaxResponse = function (e) {
this._hideAll();
this.$.passwordResetDone.hidden = false;
this.$.backToLoginBtn.focus();
};
this.dlgTitle = this.localize('resetFailed');
@ -552,11 +568,14 @@
this.$.ajaxAuth.body = {
password: btoa(unescape(encodeURIComponent(this.password1)))
};
this.password = "";
this.password1 = "";
this.password2 = "";
this.$.ajaxAuth.generateRequest();
},
onGetVersionResponse: function (event) {
var version = event.detail.response;
onGetVersionResponse: function (e) {
var version = e.detail.response;
this.appName = version.agentVersion.agentName;
this.appVersion = version.appVersion.artifactVersion;
this.environment = version.agentVersion.environment;
@ -564,9 +583,9 @@
sessionStorage.setItem("strolchAppVersion", JSON.stringify(version));
},
onGetVersionError: function (event) {
var readyState = event.detail.request.xhr.readyState;
var status = event.detail.request.xhr.status;
onGetVersionError: function (e) {
var readyState = e.detail.request.xhr.readyState;
var status = e.detail.request.xhr.status;
console.log("Ignoring get version error due to readyState: " + readyState + " / status: " + status);
},
_getEnv: function (environment) {