diff --git a/CHANGELOG.md b/CHANGELOG.md index 45982aa..366328e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -10,6 +10,7 @@ * [CHANGE] Modals should be closable by clicking the greyed out area #50 * [CHANGE] BalloonWindow keydown #67 * [FEATURE] Choose between fulltextsearch and name only search #69 +* [FEATURE] Change password #116 ## 3.0.9 diff --git a/src/index.html b/src/index.html index 7b2db18..f39ac04 100755 --- a/src/index.html +++ b/src/index.html @@ -191,6 +191,7 @@ @@ -575,6 +576,22 @@
+
+
+
+ + + + + +
+
+
+ + +
+
+
diff --git a/src/lib/auth.js b/src/lib/auth.js index aa59453..245ed50 100755 --- a/src/lib/auth.js +++ b/src/lib/auth.js @@ -410,6 +410,10 @@ var login = { balloon.init(); }, + getAdapter: function() { + return this.adapter; + }, + destroyBrowser: function() { $('#login').show(); balloon.resetDom(); diff --git a/src/lib/core.js b/src/lib/core.js index c3e1c5e..27b8bbf 100755 --- a/src/lib/core.js +++ b/src/lib/core.js @@ -413,8 +413,6 @@ var balloon = { $d.resolve(); }, error: function(body) { - console.log('GOT ERROR', body); - $d.resolve(); } }); @@ -449,6 +447,9 @@ var balloon = { $(".fs-action-element").unbind('click').click(balloon.doAction); $("#fs-browser-header").find("> div.fs-browser-column-sortable").unbind('click').click(balloon._sortTree); + //change password should only be active for users logged in with basic auth + $('#fs-menu-user-change-password').toggle(login.getAdapter() === 'basic'); + $(document).unbind('drop').on('drop', function(e) { e.stopPropagation(); e.preventDefault(); @@ -1936,6 +1937,105 @@ var balloon = { return out; }, + /** + * Display change püassword modal + * + * @return void + */ + displayChangePassword: function() { + var formValid = false; + var $fs_win = $('#fs-change-password-window'); + var $btnSave = $fs_win.find('input[name="save"]').attr('disabled', true);; + var $btnCancel = $fs_win.find('input[name="cancel"]'); + var $inputRepeatPw = $fs_win.find('input[name="password_repeat"]').val(''); + var $inputPw = $fs_win.find('input[name="password"]').val(''); + + $fs_win.find('input').removeClass('error-input'); + + var fieldsValid = { + password: false, + password_repeat: false, + }; + + $fs_win.find('input[type="password"]').off('keyup blur').on('keyup blur', function(event) { + var $this = $(this); + var fieldName = $this.attr('name'); + + if(event.keyCode && event.keyCode === 13) { + if(formValid) $btnSave.click(); + return; + } + + if(event.keyCode && event.keyCode === 9) { + //validating on tab out is performed by blur to get correct fieldName + return; + } + + if($this.val() === '') { + fieldsValid[fieldName] = false; + } else { + fieldsValid[fieldName] = true; + + if($inputRepeatPw.val() !== '' && $inputPw.val()!== '' && $inputRepeatPw.val() !== $inputPw.val()) { + fieldsValid['password_repeat'] = false; + $inputRepeatPw.addClass('error-input'); + } + } + + $this.toggleClass('error-input', !fieldsValid[fieldName]); + + formValid = Object.keys(fieldsValid).every(function(key) { + return fieldsValid[key] === true; + }); + + $btnSave.attr('disabled', !formValid); + }); + + $btnSave.off('click').on('click', function(event){ + event.preventDefault(); + + var password = $inputPw.val(); + balloon._changePassword(password).then(function() { + $fs_win.data('kendoBalloonWindow').close(); + }); + }); + + $btnCancel.off('click').on('click', function(){ + $fs_win.data('kendoBalloonWindow').close(); + }); + + $fs_win.kendoBalloonWindow({ + title: $fs_win.attr('title'), + resizable: false, + modal: true, + activate: function() { + $inputPw.focus(); + } + }).data('kendoBalloonWindow').center().open(); + }, + + /** + * Calls api to change password for current user + * + * @return void + */ + _changePassword(password) { + var data = { + password: password + }; + + return balloon.xmlHttpRequest({ + url: balloon.base+'/users/', + type: 'PATCH', + dataType: 'json', + contentType: 'application/json', + data: JSON.stringify(data), + success: function(body) { + login.doBasicAuth(login.user.username, password); + } + }); + }, + displayAvatar: function($avatar, userId) { $avatar.css('background-image', '').removeClass('has-avatar'); @@ -2524,6 +2624,10 @@ var balloon = { balloon.displayUserProfile(); break; + case 'change-password': + balloon.displayChangePassword(); + break; + case 'logout': //avoid unauthorized requests $(window).unbind('popstate'); diff --git a/src/locale/de.json b/src/locale/de.json index f02b191..90503c7 100755 --- a/src/locale/de.json +++ b/src/locale/de.json @@ -5,6 +5,7 @@ "password": "Passwort", "login": "Login", "logout": "Logout", + "change-password": "Passwort ändern", "events": "Events", "profile": "Profil", "settings": "Einstellungen", @@ -268,6 +269,10 @@ }, "events": { "show_all": "Alle Events anzeigen" + }, + "change-password": { + "password": "Passwort", + "password-repeat": "Passwort wiederholen" } }, "error": { diff --git a/src/locale/en.json b/src/locale/en.json index 8ce4e3f..dbef380 100755 --- a/src/locale/en.json +++ b/src/locale/en.json @@ -5,6 +5,7 @@ "password": "Password", "login": "Login", "logout": "Logout", + "change-password": "Change password", "events": "Events", "profile": "Profile", "settings": "Settings", @@ -267,6 +268,10 @@ }, "events": { "show_all": "Show all events" + }, + "change-password": { + "password": "Password", + "password-repeat": "Repeat password" } }, "error": { diff --git a/src/themes/default/scss/modals/_base.scss b/src/themes/default/scss/modals/_base.scss index 20f3715..1b94b13 100644 --- a/src/themes/default/scss/modals/_base.scss +++ b/src/themes/default/scss/modals/_base.scss @@ -226,3 +226,4 @@ @import './fsShareLinkSettings'; @import './fsDestroyDate'; @import './fsNewNode'; +@import './fsChangePassword'; diff --git a/src/themes/default/scss/modals/_fsChangePassword.scss b/src/themes/default/scss/modals/_fsChangePassword.scss new file mode 100644 index 0000000..1f5a4e1 --- /dev/null +++ b/src/themes/default/scss/modals/_fsChangePassword.scss @@ -0,0 +1,18 @@ +$sidePadding: 60px; + +#fs-change-password-window { + display: none; + width: 490px + (2 * $sidePadding); + + .fs-window-form { + $labelWidth: 150px; + + label { + width: $labelWidth; + } + + input[type='password'] { + width: calc(100% - #{$labelWidth + 15px}); + } + } +}