From 4bf3fa5356111a5f9441e87aa0c46a8b3ae6b48a Mon Sep 17 00:00:00 2001
From: Sam <sam.saffron@gmail.com>
Date: Wed, 8 Jun 2016 14:29:24 +1000
Subject: [PATCH] FEATURE: allow admins to prioritize full name vs username in
 the UI

Use the site setting prioritize_username_in_ux to switch between prioritizing
the full name vs username
---
 .../discourse/controllers/user-card.js.es6         |  5 +++++
 .../javascripts/discourse/controllers/user.js.es6  |  7 ++++++-
 .../javascripts/discourse/templates/user-card.hbs  | 14 +++++++++-----
 .../javascripts/discourse/templates/user/user.hbs  |  4 ++--
 .../discourse/widgets/poster-name.js.es6           | 10 ++++++----
 app/assets/stylesheets/common/base/topic-post.scss |  4 +++-
 config/locales/server.en.yml                       |  1 +
 config/site_settings.yml                           |  3 +++
 8 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/app/assets/javascripts/discourse/controllers/user-card.js.es6 b/app/assets/javascripts/discourse/controllers/user-card.js.es6
index 0001f1c23ba..377ffb97a85 100644
--- a/app/assets/javascripts/discourse/controllers/user-card.js.es6
+++ b/app/assets/javascripts/discourse/controllers/user-card.js.es6
@@ -29,6 +29,11 @@ export default Ember.Controller.extend({
   linkWebsite: Em.computed.not('user.isBasic'),
   hasLocationOrWebsite: Em.computed.or('user.location', 'user.website_name'),
 
+  @computed('user.name')
+  nameFirst(name) {
+    return !this.get('siteSettings.prioritize_username_in_ux') && name && name.trim().length > 0;
+  },
+
   @computed('user.user_fields.@each.value')
   publicUserFields() {
     const siteUserFields = this.site.get('user_fields');
diff --git a/app/assets/javascripts/discourse/controllers/user.js.es6 b/app/assets/javascripts/discourse/controllers/user.js.es6
index 618e6396099..65802be5ad9 100644
--- a/app/assets/javascripts/discourse/controllers/user.js.es6
+++ b/app/assets/javascripts/discourse/controllers/user.js.es6
@@ -41,7 +41,12 @@ export default Ember.Controller.extend(CanCheckEmails, {
     return viewingSelf || staff;
   },
 
-  @computed("content.badge_count")
+  @computed('model.user.name')
+  nameFirst(name) {
+    return !this.get('siteSettings.prioritize_username_in_ux') && name && name.trim().length > 0;
+  },
+
+  @computed("model.badge_count")
   showBadges(badgeCount) {
     return Discourse.SiteSettings.enable_badges && badgeCount > 0;
   },
diff --git a/app/assets/javascripts/discourse/templates/user-card.hbs b/app/assets/javascripts/discourse/templates/user-card.hbs
index f2ae2adb01c..68503261b3d 100644
--- a/app/assets/javascripts/discourse/templates/user-card.hbs
+++ b/app/assets/javascripts/discourse/templates/user-card.hbs
@@ -5,13 +5,17 @@
 
   <div class="names">
     <span>
-      <h1 class="{{staff}} {{new_user}}">
-        <a href={{user.path}} {{action "showUser"}}>{{username}} {{user-status user currentUser=currentUser}}</a>
+      <h1 class="{{staff}} {{new_user}} {{if nameFirst "full-name" "username"}}">
+        <a href={{user.path}} {{action "showUser"}}>{{if nameFirst user.name username}} {{user-status user currentUser=currentUser}}</a>
       </h1>
 
-      {{#if user.name}}
-        <h2>{{user.name}}</h2>
-      {{/if}}
+      {{#unless nameFirst}}
+        {{#if user.name}}
+          <h2 class='full-name'>{{user.name}}</h2>
+        {{/if}}
+      {{else}}
+        <h2 class='username'>{{username}}</h2>
+      {{/unless}}
 
       {{#if user.title}}
         <h2>{{user.title}}</h2>
diff --git a/app/assets/javascripts/discourse/templates/user/user.hbs b/app/assets/javascripts/discourse/templates/user/user.hbs
index b56472c752e..4fbca405c5b 100644
--- a/app/assets/javascripts/discourse/templates/user/user.hbs
+++ b/app/assets/javascripts/discourse/templates/user/user.hbs
@@ -58,8 +58,8 @@
           </section>
 
           <div class="primary-textual">
-            <h1>{{model.username}} {{user-status model currentUser=currentUser}}</h1>
-            <h2>{{model.name}}</h2>
+            <h1 class="{{if nameFirst "full-name" "username"}}">{{if nameFirst model.user model.username}} {{user-status model currentUser=currentUser}}</h1>
+            <h2 class="{{if nameFirst "username" "full-name"}}">{{#if nameFirst}}{{model.username}}{{else}}{{model.name}}{{/if}}</h2>
             {{#if model.title}}
               <h3>{{model.title}}</h3>
             {{/if}}
diff --git a/app/assets/javascripts/discourse/widgets/poster-name.js.es6 b/app/assets/javascripts/discourse/widgets/poster-name.js.es6
index 3c91a68d5cd..643b5e8a842 100644
--- a/app/assets/javascripts/discourse/widgets/poster-name.js.es6
+++ b/app/assets/javascripts/discourse/widgets/poster-name.js.es6
@@ -26,7 +26,9 @@ export default createWidget('poster-name', {
 
   html(attrs) {
     const username = attrs.username;
-    const classNames = ['username'];
+    const name = attrs.name;
+    const nameFirst = !this.siteSettings.prioritize_username_in_ux && name && name.length > 0;
+    const classNames = nameFirst ? ['first','full-name'] : ['first','username'];
 
     if (attrs.staff) { classNames.push('staff'); }
     if (attrs.admin) { classNames.push('admin'); }
@@ -37,14 +39,14 @@ export default createWidget('poster-name', {
     if (primaryGroupName && primaryGroupName.length) {
       classNames.push(primaryGroupName);
     }
-    const nameContents = [ this.userLink(attrs, attrs.username) ];
+    const nameContents = [ this.userLink(attrs, nameFirst ? name : username) ];
     const glyph = this.posterGlyph(attrs);
     if (glyph) { nameContents.push(glyph); }
 
     const contents = [h('span', { className: classNames.join(' ') }, nameContents)];
-    const name = attrs.name;
     if (name && this.siteSettings.display_name_on_posts && sanitizeName(name) !== sanitizeName(username)) {
-      contents.push(h('span.full-name', this.userLink(attrs, name)));
+      contents.push(h('span.second.' + (nameFirst ? "username" : "full-name"),
+            this.userLink(attrs, nameFirst ? username : name)));
     }
     const title = attrs.user_title;
     if (title && title.length) {
diff --git a/app/assets/stylesheets/common/base/topic-post.scss b/app/assets/stylesheets/common/base/topic-post.scss
index 4091cae585b..69f71677980 100644
--- a/app/assets/stylesheets/common/base/topic-post.scss
+++ b/app/assets/stylesheets/common/base/topic-post.scss
@@ -16,9 +16,11 @@
 
 .names {
  float: left;
- .username {
+
+ span.first {
    font-weight: bold;
  }
+
  span {
    font-size: 0.929em;
    padding-right: 8px;
diff --git a/config/locales/server.en.yml b/config/locales/server.en.yml
index 0fdb2fdae2e..092358eb6fd 100644
--- a/config/locales/server.en.yml
+++ b/config/locales/server.en.yml
@@ -920,6 +920,7 @@ en:
     redirect_users_to_top_page: "Automatically redirect new and long absent users to the top page."
     top_page_default_timeframe: "Default timeframe for the top view page."
     show_email_on_profile: "Show a user's email on their profile (only visible to themselves and staff)"
+    prioritize_username_in_ux: "Show username first on user page, user card and posts (when disabled name is shown first)"
 
     email_token_valid_hours: "Forgot password / activate account tokens are valid for (n) hours."
     email_token_grace_period_hours: "Forgot password / activate account tokens are still valid for a grace period of (n) hours after being redeemed."
diff --git a/config/site_settings.yml b/config/site_settings.yml
index e98480c2d35..a8561916d0e 100644
--- a/config/site_settings.yml
+++ b/config/site_settings.yml
@@ -344,6 +344,9 @@ users:
   show_email_on_profile:
     client: true
     default: false
+  prioritize_username_in_ux:
+    client: true
+    default: true
   email_token_valid_hours:
     default: 24
     min: 1