Discource-C
/
discourse
mirror of https://github.com/discourse/discourse.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Migrate upload avatar view to components

This commit is contained in:
Robin Ward 2016-11-14 16:00:12 -05:00
parent 9fea9e00c3
commit dca26b43e4
3 changed files with 10 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/assets/javascripts/discourse/controllers/avatar-selector.js.es6
View File

@ -28,9 +28,9 @@ export default Ember.Controller.extend(ModalFunctionality, {
}, },
actions: { actions: {
useUploadedAvatar() { this.set("selected", "uploaded"); }, uploadComplete() {
useGravatar() { this.set("selected", "gravatar"); }, this.set("selected", "uploaded");
useSystem() { this.set("selected", "system"); }, },
refreshGravatar() { refreshGravatar() {
this.set("gravatarRefreshDisabled", true); this.set("gravatarRefreshDisabled", true);

14
app/assets/javascripts/discourse/templates/modal/avatar-selector.hbs
View File

@ -1,18 +1,18 @@
<div class="modal-body"> {{#d-modal-body title="user.change_avatar.title" class="avatar-selector"}}
<div> <div>
<div> <div>
<input type="radio" id="system-avatar" name="avatar" value="system" {{action "useSystem"}}> {{radio-button id="system-avatar" name="avatar" value="system" selection=selected}}
<label class="radio" for="system-avatar">{{bound-avatar-template system_avatar_template "large"}} {{{i18n 'user.change_avatar.letter_based'}}}</label> <label class="radio" for="system-avatar">{{bound-avatar-template system_avatar_template "large"}} {{{i18n 'user.change_avatar.letter_based'}}}</label>
</div> </div>
<div> <div>
<input type="radio" id="gravatar" name="avatar" value="gravatar" {{action "useGravatar"}}> {{radio-button id="gravatar" name="avatar" value="gravatar" selection=selected}}
<label class="radio" for="gravatar">{{bound-avatar-template gravatar_avatar_template "large"}} {{{i18n 'user.change_avatar.gravatar'}}} {{email}}</label> <label class="radio" for="gravatar">{{bound-avatar-template gravatar_avatar_template "large"}} {{{i18n 'user.change_avatar.gravatar'}}} {{email}}</label>
{{d-button action="refreshGravatar" title="user.change_avatar.refresh_gravatar_title" disabled=gravatarRefreshDisabled icon="refresh"}} {{d-button action="refreshGravatar" title="user.change_avatar.refresh_gravatar_title" disabled=gravatarRefreshDisabled icon="refresh"}}
</div> </div>
{{#if allowAvatarUpload}} {{#if allowAvatarUpload}}
<div> <div>
<input type="radio" id="uploaded_avatar" name="avatar" value="uploaded" {{action "useUploadedAvatar"}}> {{radio-button id="uploaded-avatar" name="avatar" value="uploaded" selection=selected}}
<label class="radio" for="uploaded_avatar"> <label class="radio" for="uploaded-avatar">
{{#if custom_avatar_template}} {{#if custom_avatar_template}}
{{bound-avatar-template custom_avatar_template "large"}} {{bound-avatar-template custom_avatar_template "large"}}
{{i18n 'user.change_avatar.uploaded_avatar'}} {{i18n 'user.change_avatar.uploaded_avatar'}}
@ -24,11 +24,11 @@
uploadedAvatarTemplate=custom_avatar_template uploadedAvatarTemplate=custom_avatar_template
uploadedAvatarId=custom_avatar_upload_id uploadedAvatarId=custom_avatar_upload_id
uploading=uploading uploading=uploading
done="useUploadedAvatar"}} done="uploadComplete"}}
</div> </div>
{{/if}} {{/if}}
</div> </div>
</div> {{/d-modal-body}}
<div class="modal-footer"> <div class="modal-footer">
{{d-button action="saveAvatarSelection" class="btn-primary" disabled=uploading label="save"}} {{d-button action="saveAvatarSelection" class="btn-primary" disabled=uploading label="save"}}

20
app/assets/javascripts/discourse/views/avatar-selector.js.es6
View File

@ -1,20 +0,0 @@
import { on, observes } from "ember-addons/ember-computed-decorators";
import ModalBodyView from "discourse/views/modal-body";
export default ModalBodyView.extend({
templateName: 'modal/avatar_selector',
classNames: ['avatar-selector'],
title: I18n.t('user.change_avatar.title'),
// *HACK* used to select the proper radio button, because {{action}} stops the default behavior
@on("didInsertElement")
@observes("controller.selected")
selectedChanged() {
Em.run.next(() => $('input:radio[name="avatar"]').val([this.get('controller.selected')]));
},
@on("didInsertElement")
_focusSelectedButton() {
Em.run.next(() => $('input:radio[value="' + this.get('controller.selected') + '"]').focus());
}
});