How to get user profile image in javascript in gnome 3.28 Ubuntu 18.04

Question

I am working on an extension for gnome, in which there is a popupmenu with menuitems.One of the menuitems is called "Log out" .I have managed to display next to "Log out" the real name of the user with this code:

    let username = GLib.get_real_name();
                .........
                .........
    item = new PopupMenu.PopupMenuItem(_(list[x].text) + username);

Log out menuitem

Now I want to display and the user profile image next to real name.I tried this code but it does not work:

    let usename= GLib.get_user_name();
    let user = AccountsService.UserManager.get_default().get_user(username);
    let iconpath = user.get_icon_file();
    let icon = Gio.icon_new_for_string(iconpath);
    Icon = new St.Icon(icon);
    boxicon = new St.BoxLayout();
    boxicon.add(Icon);

It seems that the "iconpath" is null.How can I get the user profile image and display it in the menu. Thanks in advance.

Answer 1

There is a lot of JavaScript in gnome-shell that has already been written to be easily reused. Bonus, you will automatically get bugfixes and performance improvements that are made to the code (if they happen).

I would recommend you re-use, or at least look the the Avatar class in ui/userWidget.js. Not only is the code already written, but it keeps the avatar up to date, and any GNOME Shell theme that has custom styles will probably also work automatically.

You can use this class like so:

const UserWidget = imports.ui.userWidget;

let user = AccountsService.UserManager.get_default().get_user(username);
let avatar = new UserWidget.Avatar(user);
let boxicon = new St.BoxLayout();

// Notice that UserWidget.Avatar is a container class for the actual actor
boxicon.add_child(avatar.actor);

There are also other classes in there for the user name label, and a parent class that wraps them both. Be aware of classes or functions prefixed with an underscore like _doStuff(), since that's a common way of marking things as "private" or internal, and subject to change without notice.

EDIT

Also, if you're not using or targetting the latest release, use the dropdown menu in GitLab to select the branch for your release, or view the history of a file to see if anything important changed.