FIX: hand-crafted mention link creates invisible div

This commit is contained in:
Régis Hanol 2015-03-09 17:33:12 +01:00
parent 4fd19d6328
commit 9c59f77018
2 changed files with 44 additions and 35 deletions

View file

@ -71,11 +71,14 @@ export default ObjectController.extend({
this.setProperties({ user: null, userLoading: username, cardTarget: target });
var self = this;
Discourse.User.findByUsername(username, {stats: false}).then(function (user) {
return Discourse.User.findByUsername(username, { stats: false }).then(function(user) {
user = Discourse.User.create(user);
self.setProperties({ user: user, avatar: user, visible: true});
self.appEvents.trigger('usercard:shown');
}).finally(function(){
}).catch(function(error) {
self.close();
throw error;
}).finally(function() {
self.set('userLoading', null);
});
},

View file

@ -2,9 +2,9 @@ import CleansUp from 'discourse/mixins/cleans-up';
import afterTransition from 'discourse/lib/after-transition';
var clickOutsideEventName = "mousedown.outside-user-card",
clickDataExpand = "click.discourse-user-card",
clickMention = "click.discourse-user-mention";
const clickOutsideEventName = "mousedown.outside-user-card",
clickDataExpand = "click.discourse-user-card",
clickMention = "click.discourse-user-mention";
export default Discourse.View.extend(CleansUp, {
elementId: 'user-card',
@ -12,11 +12,11 @@ export default Discourse.View.extend(CleansUp, {
allowBackgrounds: Discourse.computed.setting('allow_profile_backgrounds'),
addBackground: function() {
var url = this.get('controller.user.card_background');
const url = this.get('controller.user.card_background');
if (!this.get('allowBackgrounds')) { return; }
var $this = this.$();
const $this = this.$();
if (!$this) { return; }
if (Ember.isEmpty(url)) {
@ -27,17 +27,14 @@ export default Discourse.View.extend(CleansUp, {
}.observes('controller.user.card_background'),
_setup: function() {
var self = this;
const self = this;
afterTransition(self.$(), function() {
if (!self.get('controller.visible')) {
self.$().css({ left: -9999, top: -9999 });
}
});
afterTransition(self.$(), this._hide.bind(this));
$('html').off(clickOutsideEventName).on(clickOutsideEventName, function(e) {
$('html').off(clickOutsideEventName)
.on(clickOutsideEventName, function(e) {
if (self.get('controller.visible')) {
var $target = $(e.target);
const $target = $(e.target);
if ($target.closest('[data-user-card]').data('userCard') ||
$target.closest('a.mention').length > 0 ||
$target.closest('#user-card').length > 0) {
@ -51,46 +48,48 @@ export default Discourse.View.extend(CleansUp, {
});
var expand = function(username, $target){
var postId = $target.parents('article').data('post-id');
self._willShow($target);
self.get('controller').show(username, postId, $target[0]);
const postId = $target.parents('article').data('post-id');
self.get('controller')
.show(username, postId, $target[0])
.then(function() {
self._willShow($target);
}).catch(function() {
self._hide();
});
return false;
};
$('#main-outlet').on(clickDataExpand, '[data-user-card]', function(e) {
var $target = $(e.currentTarget);
var username = $target.data('user-card');
const $target = $(e.currentTarget),
username = $target.data('user-card');
return expand(username, $target);
});
$('#main-outlet').on(clickMention, 'a.mention', function(e) {
var $target = $(e.target);
var username = $target.text().replace(/^@/, '');
const $target = $(e.target),
username = $target.text().replace(/^@/, '');
return expand(username, $target);
});
this.appEvents.on('usercard:shown', this, '_shown');
}.on('didInsertElement'),
_shown: function() {
var self = this;
_shown() {
// After the card is shown, focus on the first link
Ember.run.scheduleOnce('afterRender', function() {
self.$('a:first').focus();
});
Ember.run.scheduleOnce('afterRender', () => this.$('a:first').focus() );
},
_willShow: function(target) {
_willShow(target) {
if (!target) { return; }
var self = this,
width = this.$().width();
const self = this,
width = this.$().width();
Em.run.schedule('afterRender', function() {
if (target) {
var position = target.offset();
let position = target.offset();
if (position) {
position.left += target.width() + 10;
var overage = ($(window).width() - 50) - (position.left + width);
const overage = ($(window).width() - 50) - (position.left + width);
if (overage < 0) {
position.left += overage;
position.top += target.height() + 8;
@ -103,14 +102,21 @@ export default Discourse.View.extend(CleansUp, {
});
},
cleanUp: function() {
_hide() {
if (!this.get('controller.visible')) {
this.$().css({ left: -9999, top: -9999 });
}
},
cleanUp() {
this.get('controller').close();
},
_removeEvents: function() {
$('html').off(clickOutsideEventName);
$('#main').off(clickDataExpand);
$('#main').off(clickMention);
$('#main').off(clickDataExpand)
.off(clickMention);
this.appEvents.off('usercard:shown', this, '_shown');
}.on('willDestroyElement')