Refactor Profile to use ES6.
This commit is contained in:
Bryce Johnson
parent
37b3cac42c
commit
4ae2a30269
1 changed files with 57 additions and 60 deletions
|
|
@ -1,41 +1,14 @@
|
|||
(function() {
|
||||
var bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; };
|
||||
|
||||
this.Profile = (function() {
|
||||
function Profile(opts) {
|
||||
var cropOpts, ref;
|
||||
if (opts == null) {
|
||||
opts = {};
|
||||
}
|
||||
this.onSubmitForm = bind(this.onSubmitForm, this);
|
||||
this.form = (ref = opts.form) != null ? ref : $('.edit-user');
|
||||
$('.js-preferences-form').on('change.preference', 'input[type=radio]', function() {
|
||||
return $(this).parents('form').submit();
|
||||
// Automatically submit the Preferences form when any of its radio buttons change
|
||||
});
|
||||
$('#user_notification_email').on('change', function() {
|
||||
return $(this).parents('form').submit();
|
||||
// Automatically submit email form when it changes
|
||||
});
|
||||
$('.update-username').on('ajax:before', function() {
|
||||
$('.loading-username').show();
|
||||
$(this).find('.update-success').hide();
|
||||
return $(this).find('.update-failed').hide();
|
||||
});
|
||||
$('.update-username').on('ajax:complete', function() {
|
||||
$('.loading-username').hide();
|
||||
$(this).find('.btn-save').enable();
|
||||
return $(this).find('.loading-gif').hide();
|
||||
});
|
||||
$('.update-notifications').on('ajax:success', function(e, data) {
|
||||
if (data.saved) {
|
||||
return new Flash("Notification settings saved", "notice");
|
||||
} else {
|
||||
return new Flash("Failed to save new settings", "alert");
|
||||
}
|
||||
});
|
||||
(global => {
|
||||
class Profile {
|
||||
constructor(opts = {}) {
|
||||
this.onSubmitForm = this.onSubmitForm.bind(this);
|
||||
this.form = opts.form || $('.edit-user');
|
||||
this.bindEvents();
|
||||
cropOpts = {
|
||||
this.initAvatarGlCrop();
|
||||
}
|
||||
|
||||
initAvatarGlCrop() {
|
||||
const cropOpts = {
|
||||
filename: '.js-avatar-filename',
|
||||
previewImage: '.avatar-image .avatar',
|
||||
modalCrop: '.modal-profile-crop',
|
||||
|
|
@ -46,23 +19,51 @@
|
|||
this.avatarGlCrop = $('.js-user-avatar-input').glCrop(cropOpts).data('glcrop');
|
||||
}
|
||||
|
||||
Profile.prototype.bindEvents = function() {
|
||||
return this.form.on('submit', this.onSubmitForm);
|
||||
};
|
||||
bindEvents() {
|
||||
$('.js-preferences-form').on('change.preference', 'input[type=radio]', this.submitForm);
|
||||
$('#user_notification_email').on('change', this.submitForm);
|
||||
$('.update-username').on('ajax:before', this.beforeUpdateUsername);
|
||||
$('.update-username').on('ajax:complete', this.afterUpdateUsername);
|
||||
$('.update-notifications').on('ajax:success', this.onUpdateNotifs);
|
||||
this.form.on('submit', this.onSubmitForm);
|
||||
}
|
||||
|
||||
Profile.prototype.onSubmitForm = function(e) {
|
||||
submitForm() {
|
||||
return $(this).parents('form').submit();
|
||||
}
|
||||
|
||||
onSubmitForm(e) {
|
||||
e.preventDefault();
|
||||
return this.saveForm();
|
||||
};
|
||||
}
|
||||
|
||||
beforeUpdateUsername() {
|
||||
$('.loading-username').show();
|
||||
$(this).find('.update-success').hide();
|
||||
return $(this).find('.update-failed').hide();
|
||||
}
|
||||
|
||||
afterUpdateUsername() {
|
||||
$('.loading-username').hide();
|
||||
$(this).find('.btn-save').enable();
|
||||
return $(this).find('.loading-gif').hide();
|
||||
}
|
||||
|
||||
onUpdateNotifs(e, data) {
|
||||
return data.saved ?
|
||||
new Flash("Notification settings saved", "notice") :
|
||||
new Flash("Failed to save new settings", "alert");
|
||||
}
|
||||
|
||||
saveForm() {
|
||||
const self = this;
|
||||
const formData = new FormData(this.form[0]);
|
||||
const avatarBlob = this.avatarGlCrop.getBlob();
|
||||
|
||||
Profile.prototype.saveForm = function() {
|
||||
var avatarBlob, formData, self;
|
||||
self = this;
|
||||
formData = new FormData(this.form[0]);
|
||||
avatarBlob = this.avatarGlCrop.getBlob();
|
||||
if (avatarBlob != null) {
|
||||
formData.append('user[avatar]', avatarBlob, 'avatar.png');
|
||||
}
|
||||
|
||||
return $.ajax({
|
||||
url: this.form.attr('action'),
|
||||
type: this.form.attr('method'),
|
||||
|
|
@ -70,37 +71,33 @@
|
|||
dataType: "json",
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function(response) {
|
||||
success: (response) => {
|
||||
return new Flash(response.message, 'notice');
|
||||
},
|
||||
error: function(jqXHR) {
|
||||
error: (jqXHR) => {
|
||||
return new Flash(jqXHR.responseJSON.message, 'alert');
|
||||
},
|
||||
complete: function() {
|
||||
complete: () => {
|
||||
window.scrollTo(0, 0);
|
||||
// Enable submit button after requests ends
|
||||
return self.form.find(':input[disabled]').enable();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
return Profile;
|
||||
|
||||
})();
|
||||
}
|
||||
}
|
||||
|
||||
$(function() {
|
||||
$(document).on('focusout.ssh_key', '#key_key', function() {
|
||||
var $title, comment;
|
||||
$title = $('#key_title');
|
||||
comment = $(this).val().match(/^\S+ \S+ (.+)\n?$/);
|
||||
const $title = $('#key_title');
|
||||
const comment = $(this).val().match(/^\S+ \S+ (.+)\n?$/);
|
||||
if (comment && comment.length > 1 && $title.val() === '') {
|
||||
return $title.val(comment[1]).change();
|
||||
}
|
||||
// Extract the SSH Key title from its comment
|
||||
});
|
||||
if (gl.utils.getPagePath() === 'profiles') {
|
||||
if (global.utils.getPagePath() === 'profiles') {
|
||||
return new Profile();
|
||||
}
|
||||
});
|
||||
|
||||
}).call(this);
|
||||
})(window.gl || (window.gl = {}));
|
||||
|
|
|
|||
Loading…
Reference in a new issue