diff --git a/app/assets/javascripts/admin/templates/user_index.hbs b/app/assets/javascripts/admin/templates/user_index.hbs index e6347ff68c2..4dff9338a43 100644 --- a/app/assets/javascripts/admin/templates/user_index.hbs +++ b/app/assets/javascripts/admin/templates/user_index.hbs @@ -455,7 +455,7 @@ {{#unless anonymizeForbidden}} {{d-button label="admin.user.anonymize" icon="exclamation-triangle" - class="btn btn-danger" + class="btn-danger" disabled=anonymizeForbidden action="anonymize"}} {{/unless}} @@ -463,7 +463,7 @@ {{#unless deleteForbidden}} {{d-button label="admin.user.delete" icon="exclamation-triangle" - class="btn btn-danger" + class="btn-danger" disabled=deleteForbidden action="destroy"}} {{/unless}} diff --git a/app/assets/javascripts/discourse/components/avatar-uploader.js.es6 b/app/assets/javascripts/discourse/components/avatar-uploader.js.es6 index b67da9c65fe..f00f6742806 100644 --- a/app/assets/javascripts/discourse/components/avatar-uploader.js.es6 +++ b/app/assets/javascripts/discourse/components/avatar-uploader.js.es6 @@ -1,19 +1,19 @@ import UploadMixin from 'discourse/mixins/upload'; export default Em.Component.extend(UploadMixin, { + type: 'avatar', tagName: 'span', imageIsNotASquare: false, - type: 'avatar', uploadUrl: Discourse.computed.url('username', '/users/%@/preferences/user_image'), uploadButtonText: function() { - return this.get("uploading") ? I18n.t("uploading") : I18n.t("user.change_avatar.upload_picture"); + return this.get("uploading") ? + I18n.t("uploading") : + I18n.t("user.change_avatar.upload_picture"); }.property("uploading"), - uploadDone: function(data) { - var self = this; - + uploadDone(data) { // display a warning whenever the image is not a square this.set("imageIsNotASquare", data.result.width !== data.result.height); @@ -21,13 +21,13 @@ export default Em.Component.extend(UploadMixin, { // indeed, the server gives us back the url to the file we've just uploaded // often, this file is not a square, so we need to crop it properly // this will also capture the first frame of animated avatars when they're not allowed - Discourse.Utilities.cropAvatar(data.result.url, data.files[0].type).then(function(avatarTemplate) { - self.set("uploadedAvatarTemplate", avatarTemplate); + Discourse.Utilities.cropAvatar(data.result.url, data.files[0].type).then(avatarTemplate => { + this.set("uploadedAvatarTemplate", avatarTemplate); // indicates the users is using an uploaded avatar (must happen after cropping, otherwise // we will attempt to load an invalid avatar and cache a redirect to old one, uploadedAvatarTemplate // trumps over custom avatar upload id) - self.set("custom_avatar_upload_id", data.result.upload_id); + this.set("custom_avatar_upload_id", data.result.upload_id); }); // the upload is now done diff --git a/app/assets/javascripts/discourse/components/d-button.js.es6 b/app/assets/javascripts/discourse/components/d-button.js.es6 index 21ebedc8e82..973405128f3 100644 --- a/app/assets/javascripts/discourse/components/d-button.js.es6 +++ b/app/assets/javascripts/discourse/components/d-button.js.es6 @@ -32,5 +32,6 @@ export default Ember.Component.extend({ click() { this.sendAction("action", this.get("actionParam")); + return false; } }); diff --git a/app/assets/javascripts/discourse/controllers/avatar-selector.js.es6 b/app/assets/javascripts/discourse/controllers/avatar-selector.js.es6 index e856b5a09f8..3909f31aff4 100644 --- a/app/assets/javascripts/discourse/controllers/avatar-selector.js.es6 +++ b/app/assets/javascripts/discourse/controllers/avatar-selector.js.es6 @@ -2,8 +2,10 @@ import ModalFunctionality from 'discourse/mixins/modal-functionality'; import DiscourseController from 'discourse/controllers/controller'; export default DiscourseController.extend(ModalFunctionality, { + uploadedAvatarTemplate: null, + hasUploadedAvatar: Em.computed.or('uploadedAvatarTemplate', 'custom_avatar_upload_id'), - selectedUploadId: function(){ + selectedUploadId: function() { switch (this.get("selected")) { case "system": return this.get("system_avatar_upload_id"); case "gravatar": return this.get("gravatar_avatar_upload_id"); @@ -12,18 +14,16 @@ export default DiscourseController.extend(ModalFunctionality, { }.property('selected', 'system_avatar_upload_id', 'gravatar_avatar_upload_id', 'custom_avatar_upload_id'), actions: { - useUploadedAvatar: function() { this.set("selected", "uploaded"); }, - useGravatar: function() { this.set("selected", "gravatar"); }, - useSystem: function() { this.set("selected", "system"); }, - refreshGravatar: function() { - var self = this; - self.set("gravatarRefreshDisabled", true); - Discourse - .ajax("/user_avatar/" + this.get("username") + "/refresh_gravatar", {method: 'POST'}) - .then(function(result){ - self.set("gravatarRefreshDisabled", false); - self.set("gravatar_avatar_upload_id", result.upload_id); - }); + useUploadedAvatar() { this.set("selected", "uploaded"); }, + useGravatar() { this.set("selected", "gravatar"); }, + useSystem() { this.set("selected", "system"); }, + + refreshGravatar() { + this.set("gravatarRefreshDisabled", true); + return Discourse + .ajax("/user_avatar/" + this.get("username") + "/refresh_gravatar.json", { method: 'POST' }) + .then(result => this.set("gravatar_avatar_upload_id", result.upload_id)) + .finally(() => this.set("gravatarRefreshDisabled", false)); } } diff --git a/app/assets/javascripts/discourse/lib/show-modal.js.es6 b/app/assets/javascripts/discourse/lib/show-modal.js.es6 index 667a344ddda..7fac8a1158e 100644 --- a/app/assets/javascripts/discourse/lib/show-modal.js.es6 +++ b/app/assets/javascripts/discourse/lib/show-modal.js.es6 @@ -1,4 +1,4 @@ -export default function showModal(name, model) { +export default (name, model) => { // We use the container here because modals are like singletons // in Discourse. Only one can be shown with a particular state. const route = Discourse.__container__.lookup('route:application'); @@ -12,5 +12,4 @@ export default function showModal(name, model) { if (controller.onShow) { controller.onShow(); } controller.set('flashMessage', null); } - return controller; -} +}; diff --git a/app/assets/javascripts/discourse/mixins/show-footer.js.es6 b/app/assets/javascripts/discourse/mixins/show-footer.js.es6 index a83fdbcf2d0..b97014153af 100644 --- a/app/assets/javascripts/discourse/mixins/show-footer.js.es6 +++ b/app/assets/javascripts/discourse/mixins/show-footer.js.es6 @@ -1,14 +1,13 @@ export default Em.Mixin.create({ actions: { - didTransition: function() { - var self = this; - Em.run.schedule("afterRender", function() { - self.controllerFor("application").set("showFooter", true); + didTransition() { + Em.run.schedule("afterRender", () => { + this.controllerFor("application").set("showFooter", true); }); return true; }, - willTransition: function() { + willTransition() { this.controllerFor("application").set("showFooter", false); return true; } diff --git a/app/assets/javascripts/discourse/routes/preferences.js.es6 b/app/assets/javascripts/discourse/routes/preferences.js.es6 index 79712f495eb..7fb2ba4a41f 100644 --- a/app/assets/javascripts/discourse/routes/preferences.js.es6 +++ b/app/assets/javascripts/discourse/routes/preferences.js.es6 @@ -8,7 +8,10 @@ export default RestrictedUserRoute.extend(ShowFooter, { }, setupController(controller, user) { - controller.setProperties({ model: user, newNameInput: user.get('name') }); + controller.setProperties({ + model: user, + newNameInput: user.get('name') + }); }, actions: { @@ -16,15 +19,15 @@ export default RestrictedUserRoute.extend(ShowFooter, { showModal('avatar-selector'); // all the properties needed for displaying the avatar selector modal - const controller = this.controllerFor('avatar-selector'); - const user = this.modelFor('user'); - const props = user.getProperties( - 'username', 'email', - 'uploaded_avatar_id', - 'system_avatar_upload_id', - 'gravatar_avatar_upload_id', - 'custom_avatar_upload_id' - ); + const controller = this.controllerFor('avatar-selector'), + props = this.modelFor('user').getProperties( + 'email', + 'username', + 'uploaded_avatar_id', + 'system_avatar_upload_id', + 'gravatar_avatar_upload_id', + 'custom_avatar_upload_id' + ); switch (props.uploaded_avatar_id) { case props.system_avatar_upload_id: @@ -40,20 +43,20 @@ export default RestrictedUserRoute.extend(ShowFooter, { controller.setProperties(props); }, - saveAvatarSelection: function() { - const user = this.modelFor('user'); - const avatarSelector = this.controllerFor('avatar-selector'); + saveAvatarSelection() { + const user = this.modelFor('user'), + avatarSelector = this.controllerFor('avatar-selector'); // sends the information to the server if it has changed if (avatarSelector.get('selectedUploadId') !== user.get('uploaded_avatar_id')) { user.pickAvatar(avatarSelector.get('selectedUploadId')) - .then(function(){ - user.setProperties(avatarSelector.getProperties( - 'system_avatar_upload_id', - 'gravatar_avatar_upload_id', - 'custom_avatar_upload_id' - )); - }); + .then(() => { + user.setProperties(avatarSelector.getProperties( + 'system_avatar_upload_id', + 'gravatar_avatar_upload_id', + 'custom_avatar_upload_id' + )); + }); } // saves the data back diff --git a/app/assets/javascripts/discourse/routes/restricted-user.js.es6 b/app/assets/javascripts/discourse/routes/restricted-user.js.es6 index ad9cb411efd..46cc1fe6fe3 100644 --- a/app/assets/javascripts/discourse/routes/restricted-user.js.es6 +++ b/app/assets/javascripts/discourse/routes/restricted-user.js.es6 @@ -2,9 +2,8 @@ export default Discourse.Route.extend({ - afterModel: function() { - var user = this.modelFor('user'); - if (!user.get('can_edit')) { + afterModel() { + if (!this.modelFor('user').get('can_edit')) { this.replaceWith('userActivity'); } } diff --git a/app/assets/javascripts/discourse/templates/modal/avatar_selector.hbs b/app/assets/javascripts/discourse/templates/modal/avatar_selector.hbs index caad9187acd..0e375179c2b 100644 --- a/app/assets/javascripts/discourse/templates/modal/avatar_selector.hbs +++ b/app/assets/javascripts/discourse/templates/modal/avatar_selector.hbs @@ -7,14 +7,14 @@
- + {{d-button action="refreshGravatar" title="user.change_avatar.refresh_gravatar_title" disabled=gravatarRefreshDisabled class="no-text" icon="refresh"}}
{{avatar-uploader username=username - uploadedAvatarTemplate=view.uploadedAvatarTemplate - custom_avatar_upload_id=controller.custom_avatar_upload_id + uploadedAvatarTemplate=uploadedAvatarTemplate + custom_avatar_upload_id=custom_avatar_upload_id done="useUploadedAvatar"}}
- + {{d-button action="saveAvatarSelection" class="btn-primary" disabled=saveDisabled label="save"}} {{i18n 'cancel'}}
diff --git a/app/assets/javascripts/discourse/templates/user/preferences.hbs b/app/assets/javascripts/discourse/templates/user/preferences.hbs index 4a617f999a3..d7cc7b20c34 100644 --- a/app/assets/javascripts/discourse/templates/user/preferences.hbs +++ b/app/assets/javascripts/discourse/templates/user/preferences.hbs @@ -54,7 +54,7 @@
{{email}} {{#if can_edit_email}} - {{#link-to "preferences.email" class="btn btn-small pad-left no-text"}}{{/link-to}} + {{#link-to "preferences.email" class="btn btn-small pad-left no-text"}}{{fa-icon "pencil"}}{{/link-to}} {{/if}}
@@ -62,7 +62,7 @@
{{else}}
- + {{d-button action="checkEmail" actionParam=this title="admin.users.check_email.title" icon="envelope-o" label="admin.users.check_email.text"}}
{{/if}} @@ -72,7 +72,8 @@
- + + {{fa-icon "envelope"}} {{#if no_password}} {{i18n 'user.change_password.set_password'}} {{else}} @@ -87,9 +88,10 @@
- {{bound-avatar model "large"}} + {{! we want the "huge" version even though we're downsizing it to "large" in CSS }} + {{bound-avatar model "huge"}} {{#if allowAvatarUpload}} - + {{d-button action="showAvatarSelector" class="pad-left no-text" icon="pencil"}} {{else}} {{#unless ssoOverridesAvatar}} {{fa-icon "pencil"}} @@ -245,7 +247,7 @@ {{/if}} diff --git a/app/assets/javascripts/discourse/views/avatar-selector.js.es6 b/app/assets/javascripts/discourse/views/avatar-selector.js.es6 index 40414660a6d..ed60610505b 100644 --- a/app/assets/javascripts/discourse/views/avatar-selector.js.es6 +++ b/app/assets/javascripts/discourse/views/avatar-selector.js.es6 @@ -4,9 +4,6 @@ export default ModalBodyView.extend({ templateName: 'modal/avatar_selector', classNames: ['avatar-selector'], title: I18n.t('user.change_avatar.title'), - saveDisabled: false, - gravatarRefreshEnabled: Em.computed.not('controller.gravatarRefreshDisabled'), - hasUploadedAvatar: Em.computed.or('uploadedAvatarTemplate', 'controller.custom_avatar_upload_id'), // *HACK* used to select the proper radio button, cause {{action}} // stops the default behavior diff --git a/app/assets/stylesheets/desktop/user.scss b/app/assets/stylesheets/desktop/user.scss index cc3fe231583..6936c8d6055 100644 --- a/app/assets/stylesheets/desktop/user.scss +++ b/app/assets/stylesheets/desktop/user.scss @@ -170,6 +170,13 @@ border-bottom: 1px solid scale-color-diff(); } } + + .pref-avatar { + .avatar { + max-width: 45px; + max-height: 45px; + } + } } .about { diff --git a/test/javascripts/controllers/avatar-selector-test.js.es6 b/test/javascripts/controllers/avatar-selector-test.js.es6 index 8d7441d6e24..3f2f0af811e 100644 --- a/test/javascripts/controllers/avatar-selector-test.js.es6 +++ b/test/javascripts/controllers/avatar-selector-test.js.es6 @@ -3,7 +3,8 @@ moduleFor("controller:avatar-selector", "controller:avatar-selector", { }); test("avatarTemplate", function() { - var avatarSelectorController = this.subject(); + const avatarSelectorController = this.subject(); + avatarSelectorController.setProperties({ selected: "system", system_avatar_upload_id:1, @@ -11,17 +12,11 @@ test("avatarTemplate", function() { custom_avatar_upload_id: 3 }); - equal(avatarSelectorController.get("selectedUploadId"), 1, - "we are using system by default"); + equal(avatarSelectorController.get("selectedUploadId"), 1, "we are using system by default"); avatarSelectorController.set('selected', 'gravatar'); - - equal(avatarSelectorController.get("selectedUploadId"), 2, - "we are using gravatar when set"); + equal(avatarSelectorController.get("selectedUploadId"), 2, "we are using gravatar when set"); avatarSelectorController.set("selected", "custom"); - - equal(avatarSelectorController.get("selectedUploadId"), 3, - "we are using custom when set"); - + equal(avatarSelectorController.get("selectedUploadId"), 3, "we are using custom when set"); });