From 9f127d8183ae4037fce4cd477927f1a5d50d7897 Mon Sep 17 00:00:00 2001
From: Robin Ward <robin.ward@gmail.com>
Date: Mon, 10 Nov 2014 11:31:28 -0500
Subject: [PATCH] UX: Focus on the user card when it's rendered

---
 .../discourse/controllers/user-card.js.es6    |  1 +
 .../discourse/views/user-card.js.es6          | 19 ++++++++++++++-----
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/app/assets/javascripts/discourse/controllers/user-card.js.es6 b/app/assets/javascripts/discourse/controllers/user-card.js.es6
index 8fbfec442d2..90cfd460139 100644
--- a/app/assets/javascripts/discourse/controllers/user-card.js.es6
+++ b/app/assets/javascripts/discourse/controllers/user-card.js.es6
@@ -78,6 +78,7 @@ export default ObjectController.extend({
 
     Discourse.User.findByUsername(username).then(function (user) {
       self.setProperties({ user: user, avatar: user, visible: true});
+      self.appEvents.trigger('usercard:shown');
     }).finally(function(){
       self.set('userLoading', null);
     });
diff --git a/app/assets/javascripts/discourse/views/user-card.js.es6 b/app/assets/javascripts/discourse/views/user-card.js.es6
index 96ef15947fd..b9ab9cf2028 100644
--- a/app/assets/javascripts/discourse/views/user-card.js.es6
+++ b/app/assets/javascripts/discourse/views/user-card.js.es6
@@ -25,13 +25,12 @@ export default Discourse.View.extend(CleansUp, {
 
   _setup: function() {
     var self = this;
-    this.appEvents.on('poster:expand', this, '_posterExpand');
 
     $('html').off(clickOutsideEventName).on(clickOutsideEventName, function(e) {
       if (self.get('controller.visible')) {
         var $target = $(e.target);
         if ($target.closest('[data-user-card]').data('userCard') ||
-            $target.closest('a.mention').length > 0 || 
+            $target.closest('a.mention').length > 0 ||
             $target.closest('#user-card').length > 0) {
           return;
         }
@@ -43,7 +42,7 @@ export default Discourse.View.extend(CleansUp, {
     });
 
     var expand = function(username, $target){
-      self._posterExpand($target);
+      self._willShow($target);
       self.get('controller').show(username, $target[0]);
       return false;
     };
@@ -59,9 +58,19 @@ export default Discourse.View.extend(CleansUp, {
       var username = $target.text().replace(/^@/, '');
       return expand(username, $target);
     });
+
+    this.appEvents.on('usercard:shown', this, '_shown');
   }.on('didInsertElement'),
 
-  _posterExpand: function(target) {
+  _shown: function() {
+    var self = this;
+    // After the card is shown, focus on the first link
+    Ember.run.scheduleOnce('afterRender', function() {
+      self.$('a:first').focus();
+    });
+  },
+
+  _willShow: function(target) {
     if (!target) { return; }
     var self = this,
         width = this.$().width();
@@ -93,7 +102,7 @@ export default Discourse.View.extend(CleansUp, {
     $('#main').off(clickDataExpand);
     $('#main').off(clickMention);
 
-    this.appEvents.off('poster:expand', this, '_posterExpand');
+    this.appEvents.off('usercard:shown', this, '_shown');
   }.on('willDestroyElement')
 
 });