[gnome-shell] unlockDialog: move user widget into separate file

[Ray Strode <halfline src gnome org>]

commit a3d3d814475c9dd24bd07087ff42fdc039db32db
Author: Ray Strode <rstrode redhat com>
Date:   Sun Feb 17 20:54:46 2013 -0500

    unlockDialog: move user widget into separate file
    
    The user widget is the username and avatar shown on
    the unlock dialog.
    
    The login dialog has something very similar.
    
    This commit separates the user widget out to its own
    file, so we can use it from the login dialog in a
    later commit.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=694062

 data/theme/gnome-shell.css |   10 ++++++-
 js/Makefile.am             |    1 +
 js/ui/unlockDialog.js      |   56 +--------------------------------------
 js/ui/userWidget.js        |   61 ++++++++++++++++++++++++++++++++++++++++++++
 4 files changed, 73 insertions(+), 55 deletions(-)
---
diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css
index 52b0f69..6610cbb 100644
--- a/data/theme/gnome-shell.css
+++ b/data/theme/gnome-shell.css
@@ -2408,10 +2408,18 @@ StScrollView.frequent-apps StScrollBar {
     color: orange;
 }
 
-.unlock-dialog-user-name-container {
+.user-widget {
     spacing: .4em;
 }
 
+.user-widget-label {
+    font-size: 16pt;
+    font-weight: bold;
+    text-align: left;
+    padding-left: 15px;
+    text-shadow: black 0px 4px 3px 0px;
+}
+
 /* Screen shield */
 
 .screen-shield-background {
diff --git a/js/Makefile.am b/js/Makefile.am
index b6fcea7..8b19bcb 100644
--- a/js/Makefile.am
+++ b/js/Makefile.am
@@ -93,6 +93,7 @@ nobase_dist_js_DATA =         \
        ui/tweener.js           \
        ui/unlockDialog.js      \
        ui/userMenu.js          \
+       ui/userWidget.js        \
        ui/viewSelector.js      \
        ui/wanda.js             \
        ui/windowAttentionHandler.js    \
diff --git a/js/ui/unlockDialog.js b/js/ui/unlockDialog.js
index f1efe5c..8ddb3e3 100644
--- a/js/ui/unlockDialog.js
+++ b/js/ui/unlockDialog.js
@@ -18,6 +18,7 @@ const Panel = imports.ui.panel;
 const ShellEntry = imports.ui.shellEntry;
 const Tweener = imports.ui.tweener;
 const UserMenu = imports.ui.userMenu;
+const UserWidget = imports.ui.userWidget;
 
 const Batch = imports.gdm.batch;
 const GdmUtil = imports.gdm.util;
@@ -55,59 +56,6 @@ function isSupported() {
     }
 }
 
-// A widget showing the user avatar and name
-const UserWidget = new Lang.Class({
-    Name: 'UserWidget',
-
-    _init: function(user) {
-        this._user = user;
-
-        this.actor = new St.BoxLayout({ style_class: 'unlock-dialog-user-name-container',
-                                        vertical: false });
-
-        this._avatar = new UserMenu.UserAvatarWidget(user);
-        this.actor.add(this._avatar.actor,
-                       { x_fill: true, y_fill: true });
-
-        this._label = new St.Label({ style_class: 'login-dialog-username' });
-        this.actor.add(this._label,
-                       { expand: true,
-                         x_fill: true,
-                         y_fill: false,
-                         y_align: St.Align.MIDDLE });
-
-        this._userLoadedId = this._user.connect('notify::is-loaded',
-                                                Lang.bind(this, this._updateUser));
-        this._userChangedId = this._user.connect('changed',
-                                                 Lang.bind(this, this._updateUser));
-        if (this._user.is_loaded)
-            this._updateUser();
-    },
-
-    destroy: function() {
-        if (this._userLoadedId != 0) {
-            this._user.disconnect(this._userLoadedId);
-            this._userLoadedId = 0;
-        }
-
-        if (this._userChangedId != 0) {
-            this._user.disconnect(this._userChangedId);
-            this._userChangedId = 0;
-        }
-
-        this.actor.destroy();
-    },
-
-    _updateUser: function() {
-        if (this._user.is_loaded)
-            this._label.text = this._user.get_real_name();
-        else
-            this._label.text = '';
-
-        this._avatar.update();
-    }
-});
-
 const UnlockDialog = new Lang.Class({
     Name: 'UnlockDialog',
     Extends: ModalDialog.ModalDialog,
@@ -138,7 +86,7 @@ const UnlockDialog = new Lang.Class({
         this._userVerifier.connect('show-login-hint', Lang.bind(this, this._showLoginHint));
         this._userVerifier.connect('hide-login-hint', Lang.bind(this, this._hideLoginHint));
 
-        this._userWidget = new UserWidget(this._user);
+        this._userWidget = new UserWidget.UserWidget(this._user);
         this.contentLayout.add_actor(this._userWidget.actor);
 
         this._promptLayout = new St.BoxLayout({ style_class: 'login-dialog-prompt-layout',
diff --git a/js/ui/userWidget.js b/js/ui/userWidget.js
new file mode 100644
index 0000000..06de0fc
--- /dev/null
+++ b/js/ui/userWidget.js
@@ -0,0 +1,61 @@
+
+// -*- mode: js; js-indent-level: 4; indent-tabs-mode: nil -*-
+//
+// A widget showing the user avatar and name
+const AccountsService = imports.gi.AccountsService;
+const Lang = imports.lang;
+const St = imports.gi.St;
+
+const UserMenu = imports.ui.userMenu;
+
+const UserWidget = new Lang.Class({
+    Name: 'UserWidget',
+
+    _init: function(user) {
+        this._user = user;
+
+        this.actor = new St.BoxLayout({ style_class: 'user-widget',
+                                        vertical: false });
+
+        this._avatar = new UserMenu.UserAvatarWidget(user);
+        this.actor.add(this._avatar.actor,
+                       { x_fill: true, y_fill: true });
+
+        this._label = new St.Label({ style_class: 'user-widget-label' });
+        this.actor.add(this._label,
+                       { expand: true,
+                         x_fill: true,
+                         y_fill: false,
+                         y_align: St.Align.MIDDLE });
+
+        this._userLoadedId = this._user.connect('notify::is-loaded',
+                                                Lang.bind(this, this._updateUser));
+        this._userChangedId = this._user.connect('changed',
+                                                 Lang.bind(this, this._updateUser));
+        if (this._user.is_loaded)
+            this._updateUser();
+    },
+
+    destroy: function() {
+        if (this._userLoadedId != 0) {
+            this._user.disconnect(this._userLoadedId);
+            this._userLoadedId = 0;
+        }
+
+        if (this._userChangedId != 0) {
+            this._user.disconnect(this._userChangedId);
+            this._userChangedId = 0;
+        }
+
+        this.actor.destroy();
+    },
+
+    _updateUser: function() {
+        if (this._user.is_loaded)
+            this._label.text = this._user.get_real_name();
+        else
+            this._label.text = '';
+
+        this._avatar.update();
+    }
+});