[polari/wip/raresv/finalRebase: 8/18] userDetails: first userDetails patch

[Rares Visalom <raresvisalom src gnome org>]

commit fcaa73d817261c1ac577e89187747db22936586d
Author: raresv <rares visalom gmail com>
Date:   Thu Aug 18 15:58:02 2016 +0300

    userDetails: first userDetails patch
    
    userDetails: first userDetails UI patch.

 data/resources/user-details.ui |  100 ++++++++++++++++++++++++++++++++++------
 src/userList.js                |   75 ++++++++++++++++++++++--------
 2 files changed, 141 insertions(+), 34 deletions(-)
---
diff --git a/data/resources/user-details.ui b/data/resources/user-details.ui
index bd009fc..91be102 100644
--- a/data/resources/user-details.ui
+++ b/data/resources/user-details.ui
@@ -3,11 +3,12 @@
   <template class="Gjs_UserDetails" parent="GtkFrame">
     <property name="visible">True</property>
     <property name="hexpand">True</property>
+    <property name="shadow-type">none</property>
     <child>
       <object class="GtkBox" id="box">
         <property name="orientation">vertical</property>
-        <property name="spacing">6</property>
-        <property name="margin">6</property>
+        <property name="spacing">2</property>
+        <property name="margin">9</property>
         <property name="visible">True</property>
         <child>
           <object class="GtkBox" id="spinnerBox">
@@ -33,29 +34,42 @@
           <object class="GtkGrid" id="detailsGrid">
             <property name="row-spacing">6</property>
             <property name="column-spacing">6</property>
+            <property name="margin-end">18</property>
             <property name="hexpand">True</property>
             <property name="visible">True</property>
             <child>
-              <object class="GtkLabel" id="fullnameLabel">
-                <property name="ellipsize">end</property>
+              <object class="GtkImage">
+                <property name="icon-name">document-open-recent-symbolic</property>
+                <property name="visible" bind-source="lastLabel"
+                          bind-property="visible" bind-flags="sync-create"/>
+                <property name="no-show-all">True</property>
                 <property name="halign">start</property>
-                <property name="visible">True</property>
+                <property name="margin-left">0</property>
+                <style>
+                  <class name="dim-label" />
+                </style>
               </object>
               <packing>
-                <property name="width">2</property>
+                <property name="width">1</property>
                 <property name="top-attach">0</property>
                 <property name="left-attach">0</property>
               </packing>
             </child>
             <child>
-              <object class="GtkLabel" id="lastHeader">
+              <object class="GtkLabel">
                 <property name="label" translatable="yes">Last Activity:</property>
                 <property name="valign">start</property>
-                <property name="use-markup">True</property>
-                <property name="visible">True</property>
+                <property name="halign">start</property>
+                <property name="no-show-all">True</property>
+                <property name="visible" bind-source="lastLabel"
+                          bind-property="visible" bind-flags="sync-create"/>
+                <property name="margin-start">20</property>
+                <style>
+                  <class name="dim-label" />
+                </style>
               </object>
               <packing>
-                <property name="top-attach">1</property>
+                <property name="top-attach">0</property>
                 <property name="left-attach">0</property>
               </packing>
             </child>
@@ -65,24 +79,80 @@
                 <property name="use-markup">True</property>
                 <property name="wrap">True</property>
                 <property name="hexpand">True</property>
+                <property name="visible">False</property>
+                <property name="no-show-all">True</property>
+                <property name="hexpand">True</property>
+                <property name="halign">start</property>
+                <style>
+                  <class name="dim-label" />
+                </style>
+              </object>
+              <packing>
+                <property name="top-attach">0</property>
+                <property name="left-attach">1</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkImage">
+                <property name="icon-name">avatar-default-symbolic</property>
                 <property name="visible">True</property>
+                <property name="halign">start</property>
+                <property name="margin-left">0</property>
+                <style>
+                  <class name="dim-label" />
+                </style>
               </object>
               <packing>
+                <property name="width">1</property>
                 <property name="top-attach">1</property>
-                <property name="left-attach">1</property>
+                <property name="left-attach">0</property>
               </packing>
             </child>
+            <child>
+              <object class="GtkLabel" id="fullnameLabel">
+                <property name="ellipsize">end</property>
+                <property name="halign">start</property>
+                <property name="visible">True</property>
+                <property name="margin-start">20</property>
+                <property name="hexpand">True</property>
+                <property name="use-markup">True</property>
+                <style>
+                  <class name="dim-label" />
+                </style>
+              </object>
+              <packing>
+                <property name="width">2</property>
+                <property name="top-attach">1</property>
+                <property name="left-attach">0</property>
+              </packing>
+            </child>
+          </object>
+        </child>
+        <child>
+          <object class="GtkSeparator">
+            <property name="visible" bind-source="messageButton"
+                      bind-property="visible" bind-flags="sync-create"/>
+            <property name="margin-top">7</property>
           </object>
         </child>
         <child>
-          <object class="GtkButton" id="messageButton">
-            <property name="label" translatable="yes">Message</property>
-            <property name="margin-top">12</property>
-            <property name="halign">end</property>
+          <object class="GtkModelButton" id="messageButton">
+            <property name="text" translatable="yes">Message</property>
+            <property name="halign">fill</property>
             <property name="hexpand">True</property>
             <property name="visible">True</property>
+            <property name="no-show-all">True</property>
           </object>
         </child>
+        <!-- <child>
+          <object class="GtkModelButton" id="pastActivityButton">
+            <property name="text" translatable="yes">View Past Activity</property>
+            <property name="halign">fill</property>
+            <property name="hexpand">True</property>
+            <property name="visible">True</property>
+            <property name="no-show-all">True</property>
+          </object>
+        </child> -->
       </object>
     </child>
   </template>
diff --git a/src/userList.js b/src/userList.js
index ea6e2dd..67f3f79 100644
--- a/src/userList.js
+++ b/src/userList.js
@@ -107,7 +107,6 @@ const UserDetails = new Lang.Class({
                        'spinner',
                        'detailsGrid',
                        'fullnameLabel',
-                       'lastHeader',
                        'lastLabel',
                        'messageButton'],
     Properties: { 'expanded': GObject.ParamSpec.boolean('expanded',
@@ -117,19 +116,49 @@ const UserDetails = new Lang.Class({
                                                         false)},
 
     _init: function(params) {
-        this._user = params.user;
-        delete params.user;
-
         this._expanded = false;
+        this._initialDetailsLoaded = false;
 
         this.parent(params);
 
         this._messageButton.connect('clicked',
-                                    Lang.bind(this, this._onButtonClicked));
-        this._user.connection.connect('notify::self-contact',
-                                      Lang.bind(this, this._updateButtonVisibility));
+                                    Lang.bind(this, this._onMessageButtonClicked));
+
         this._updateButtonVisibility();
         this._detailsGrid.hide();
+
+        this._fullnameLabel.max_width_chars = 50;
+    },
+
+    set user(user) {
+        if (this._user == user)
+            return;
+
+        if (this._user)
+            this._user.connection.disconnect(this._selfContactChangedId);
+        this._selfContactChangedId = 0;
+
+        this._user = user;
+
+        if (this._user)
+            this._selfContactChangedId = this._user.connection.connect('notify::self-contact',
+                                                    Lang.bind(this, this._updateButtonVisibility));
+
+        if (this.expanded)
+            this._expand();
+
+        this._updateButtonVisibility();
+        this._lastLabel.visible = this._user != null;
+    },
+
+    set nickname(nickname) {
+        this._nickname = nickname;
+
+        if (!this._fullnameLabel.label)
+            this._fullnameLabel.label = this._nickname || '';
+
+
+        this._updateButtonVisibility();
     },
 
     get expanded() {
@@ -151,13 +180,14 @@ const UserDetails = new Lang.Class({
     },
 
     _expand: function() {
-        let prevDetails = this._fullnameLabel.label != '';
-        this._detailsGrid.visible = prevDetails;
-        this._spinnerBox.visible = !prevDetails;
+        this._detailsGrid.visible = this._initialDetailsLoaded;
+        this._spinnerBox.visible = !this._initialDetailsLoaded;
         this._spinner.start();
 
         this._cancellable = new Gio.Cancellable();
-        this._user.request_contact_info_async(this._cancellable,
+
+        if (this._user)
+            this._user.request_contact_info_async(this._cancellable,
                                               Lang.bind(this, this._onContactInfoReady));
     },
 
@@ -200,6 +230,8 @@ const UserDetails = new Lang.Class({
     },
 
     _onContactInfoReady: function(c, res) {
+        this._initialDetailsLoaded = true;
+
         let fn, last;
         let info = this._user.get_contact_info();
         for (let i = 0; i < info.length; i++) {
@@ -215,22 +247,22 @@ const UserDetails = new Lang.Class({
         this._fullnameLabel.label = fn;
 
         if (last) {
-            this._lastHeader.label = '<small>' + _("Last Activity:") + '</small>';
-            this._lastHeader.show();
-
-            this._lastLabel.label = '<small>' + this._formatLast(last) + '</small>';
+            this._lastLabel.label = this._formatLast(last);
             this._lastLabel.show();
         } else {
-            this._lastHeader.hide();
             this._lastLabel.hide();
         }
 
+        this._revealDetails();
+    },
+
+    _revealDetails: function() {
         this._spinner.stop();
         this._spinnerBox.hide();
         this._detailsGrid.show();
     },
 
-    _onButtonClicked: function() {
+    _onMessageButtonClicked: function() {
         let account = this._user.connection.get_account();
 
         let app = Gio.Application.get_default();
@@ -244,8 +276,13 @@ const UserDetails = new Lang.Class({
     },
 
     _updateButtonVisibility: function() {
-        let visible = this._user != this._user.connection.self_contact;
-        this._messageButton.visible = visible;
+        if (this._user == this._user.connection.self_contact) {
+            this._messageButton.visible = false;
+            this._messageButton.sensitive = true;
+        } else {
+            this._messageButton.visible = true;
+            this._messageButton.sensitive = true;
+        }
     }
 });