Post Expansion enhancements

app/assets/javascripts/discourse/controllers/composer_messages_controller.js

@@ -89,7 +89,6 @@ Discourse.ComposerMessagesController = Ember.ArrayController.extend({
     Discourse.ComposerMessage.find(composer).then(function (messages) {
       self.set('checkedMessages', true);
       messages.forEach(function (msg) {
-        console.log(msg);
         if (msg.wait_for_typing) {
           queuedForTyping.addObject(msg);
         } else {

app/assets/javascripts/discourse/controllers/poster_expansion_controller.js

@@ -12,10 +12,14 @@ Discourse.PosterExpansionController = Discourse.ObjectController.extend({
   user: null,
   participant: null,
 
+  postStream: Em.computed.alias('controllers.topic.postStream'),
   enoughPostsForFiltering: Em.computed.gte('participant.post_count', 2),
-  showFilter: Em.computed.and('controllers.topic.postStream.hasNoFilters', 'enoughPostsForFiltering'),
+
+  showFilter: Em.computed.and('postStream.hasNoFilters', 'enoughPostsForFiltering'),
   showName: Discourse.computed.propertyNotEqual('user.name', 'user.username'),
 
+  hasUserFilters: Em.computed.gt('postStream.userFilters.length', 0),
+
   show: function(post) {
 
     // Don't show on mobile
@@ -24,11 +28,13 @@ Discourse.PosterExpansionController = Discourse.ObjectController.extend({
       return;
     }
 
-    var currentPostId = this.get('id');
+    var currentPostId = this.get('id'),
+        wasVisible = this.get('visible');
+
     this.setProperties({model: post, visible: true});
 
-    // If we're showing the same user we showed last time, just keep it
-    if (post.get('id') === currentPostId) {
+    // If we click the avatar again, close it.
+    if (post.get('id') === currentPostId && wasVisible) {
       this.setProperties({ visible: false, model: null });
       return;
     }
@@ -57,7 +63,11 @@ Discourse.PosterExpansionController = Discourse.ObjectController.extend({
       var postStream = this.get('controllers.topic.postStream');
       postStream.toggleParticipant(user.get('username'));
       this.close();
-    }
+    },
+    cancelFilter: function() {
+      this.get('postStream').cancelFilter();
+      this.close();
+    },
   }
 
 });

app/assets/javascripts/discourse/templates/poster_expansion.handlebars

@@ -1,13 +1,14 @@
 {{#if model}}
   {{boundAvatar model imageSize="huge"}}
 
-  <h1><a {{bindAttr href="usernameUrl"}}>{{username}}</a></h1>
+  <h1 {{bindAttr class="staff new_user"}}><a {{bindAttr href="usernameUrl"}}>{{username}}</a></h1>
   {{#if showName}}
     <h2><a {{bindAttr href="usernameUrl"}}>{{name}}</a></h2>
   {{/if}}
 
   {{#if user}}
     <h3>{{i18n last_post}} {{date path="user.last_posted_at" leaveAgo="true"}}</h3>
+    <h3>{{i18n joined}} {{date path="user.created_at" leaveAgo="true"}}</h3>
 
     <div class='bottom'>
       {{#if user.bio_cooked}}<div class='bio'>{{{user.bio_cooked}}}</div>{{/if}}
@@ -22,6 +23,10 @@
         <button class='btn' {{action togglePosts user}}><i class='icon icon-filter'></i>{{i18n topic.filter_to username="username" post_count="participant.post_count"}}</button>
       {{/if}}
 
+      {{#if hasUserFilters}}
+        <button class='btn' {{action cancelFilter}}><i class='icon icon-remove'></i>{{i18n topic.filters.cancel}}</button>
+      {{/if}}
+
     </div>
   {{else}}
     <p class='loading'>{{i18n loading}}</p>

app/assets/javascripts/discourse/views/poster_expansion_view.js

@@ -23,8 +23,10 @@ Discourse.PosterExpansionView = Discourse.View.extend({
             $avatar = $('.topic-meta-data img.avatar', $post),
             position = $avatar.offset();
 
-        position.left += $avatar.width() + 5;
-        self.$().css(position);
+        if (position) {
+          position.left += $avatar.width() + 5;
+          self.$().css(position);
+        }
       }
     });
 

app/assets/stylesheets/desktop/poster_expansion.scss

@@ -13,6 +13,10 @@
   padding: 7px 7px 6px 7px;
   width: 400px;
 
+  h1.new-user a {
+    color: $dark_gray;
+  }
+
   h1 {
     font-size: 30px;
     line-height: 33px;
@@ -27,6 +31,7 @@
     font-size: 20px;
     line-height: 22px;
     font-weight: normal;
+    margin-bottom: 5px;
 
     a {
       color: #333;
@@ -36,7 +41,7 @@
   h3 {
     font-size: 13px;
     font-weight: normal;
-    margin-top: 15px;
+    margin-top: 0px;
     color: #666;
   }
 

app/assets/stylesheets/desktop/topic-post.scss

@@ -29,6 +29,16 @@
   }
 }
 
+.staff a {
+  @include border-radius-all(3px);
+  padding: 1px 3px;
+  background-color: #ffe;
+  border: 1px solid #ffd;
+}
+
+.new-user a[href] {
+  color: $dark_gray;
+}
 
 #selected-posts {
   position: fixed;
@@ -360,17 +370,6 @@
         line-height: 36px;
       }
 
-      .staff a {
-        @include border-radius-all(3px);
-        padding: 1px 3px;
-        background-color: #ffe;
-        border: 1px solid #ffd;
-      }
-
-      h3.new-user a[href] {
-        color: $dark_gray;
-      }
-
       div {
         display: block;
       }

config/locales/client.en.yml

@@ -88,6 +88,7 @@ en:
     log_in: "Log In"
     age: "Age"
     last_post: "Last Post"
+    joined: "Joined"
     admin_title: "Admin"
     flags_title: "Flags"
     show_more: "show more"