fix: display user card background image

This commit is contained in:
Jeff Wong 2018-04-16 21:00:59 -07:00
parent 828bfd9d27
commit 12e321da18
2 changed files with 21 additions and 18 deletions

View File

@ -1,7 +1,8 @@
import { wantsNewWindow } from 'discourse/lib/intercept-click';
import CleansUp from 'discourse/mixins/cleans-up';
import afterTransition from 'discourse/lib/after-transition';
import { default as computed } from 'ember-addons/ember-computed-decorators';
import { propertyNotEqual, setting } from 'discourse/lib/computed';
import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
import DiscourseURL from 'discourse/lib/url';
import User from 'discourse/models/user';
import { userPath } from 'discourse/lib/url';
@ -16,6 +17,8 @@ const maxMembersToDisplay = 10;
export default Ember.Component.extend(CleansUp, {
elementId: 'user-card',
classNameBindings: ['visible:show', 'showBadges', 'hasCardBadgeImage', 'user.card_background::no-bg'],
allowBackgrounds: setting('allow_profile_backgrounds'),
showBadges: setting('enable_badges'),
postStream: Ember.computed.alias('topic.postStream'),
viewingTopic: Ember.computed.match('currentPath', /^topic\./),
@ -43,6 +46,21 @@ export default Ember.Component.extend(CleansUp, {
return cardType === 'group';
},
@observes('user.card_background')
addBackground() {
if (!this.get('allowBackgrounds')) { return; }
const $this = this.$();
if (!$this) { return; }
const url = this.get('user.card_background');
const bg = Ember.isEmpty(url) ? '' : `url(${Discourse.getURLWithCDN(url)})`;
$this.css('background-image', bg);
},
@computed('user.card_badge.image')
hasCardBadgeImage: image => image && image.indexOf('fa-') !== 0,
_showUser(username, $target) {
const args = { stats: false };
args.include_post_count_for = this.get('topic.id');

View File

@ -1,4 +1,4 @@
import { default as computed, observes } from 'ember-addons/ember-computed-decorators';
import { default as computed } from 'ember-addons/ember-computed-decorators';
import { propertyNotEqual, setting } from 'discourse/lib/computed';
import { durationTiny } from 'discourse/lib/formatter';
import CanCheckEmails from 'discourse/mixins/can-check-emails';
@ -6,13 +6,13 @@ import CanCheckEmails from 'discourse/mixins/can-check-emails';
export default Ember.Component.extend(CanCheckEmails, {
allowBackgrounds: setting('allow_profile_backgrounds'),
showBadges: setting('enable_badges'),
enoughPostsForFiltering: Ember.computed.gte('topicPostCount', 2),
showFilter: Ember.computed.and('viewingTopic', 'postStream.hasNoFilters', 'enoughPostsForFiltering'),
showName: propertyNotEqual('user.name', 'user.username'),
hasUserFilters: Ember.computed.gt('postStream.userFilters.length', 0),
isSuspended: Ember.computed.notEmpty('user.suspend_reason'),
showBadges: setting('enable_badges'),
showMoreBadges: Ember.computed.gt('moreBadgesCount', 0),
showDelete: Ember.computed.and("viewingAdmin", "showName", "user.canBeDeleted"),
linkWebsite: Ember.computed.not('user.isBasic'),
@ -50,21 +50,6 @@ export default Ember.Component.extend(CanCheckEmails, {
@computed('user.badge_count', 'user.featured_user_badges.length')
moreBadgesCount: (badgeCount, badgeLength) => badgeCount - badgeLength,
@computed('user.card_badge.image')
hasCardBadgeImage: image => image && image.indexOf('fa-') !== 0,
@observes('user.card_background')
addBackground() {
if (!this.get('allowBackgrounds')) { return; }
const $this = this.$();
if (!$this) { return; }
const url = this.get('user.card_background');
const bg = Ember.isEmpty(url) ? '' : `url(${Discourse.getURLWithCDN(url)})`;
$this.css('background-image', bg);
},
@computed('user.time_read', 'user.recent_time_read')
showRecentTimeRead(timeRead, recentTimeRead) {
return timeRead !== recentTimeRead && recentTimeRead !== 0;