Add script to show user name on welcome screen of service portal

[Nic Omaha]

When you log into HI it says morning or evening and the users name. I found in service portal where to edit the text but I cant seem to figure out the scripting behind this feature as I think its pretty cool. Any one have any ideas how they accomplished this?

[shill]

!It's been a few months since I played with this, but ours looks like this:

This was done by using the following script in the server script of the widget

(function() {
   /* populate the 'data' object */
   /* e.g., data.table = $sp.getValue('table'); */

       data.sysUserID = gs.getUserID();
               if (!data.sysUserID)
                                         data.sysUserID = gs.getUser().getID();
       var sysUserGR = new GlideRecord("sys_user");
       data.userExists = sysUserGR.get(data.sysUserID);

       if (data.userExists) {
               data.name = sysUserGR.getValue("first_name");
       } else {
               data.name = "User"
       }     

})();

This populates the data object with the logged in user.

I then used this line in the HTML to display that data after the options.title with this line

<h1 class="text-center font-thin hidden-xs text-4x m-b-lg sp-tagline-color">{{options.title}} {{data.name}}?</h1>

Close to what you are after, at least name wise. I would think you could also figure out the morning/afternoon the same way.

[Arnoud Kooi]

The user object is available in your angular scope by default.

If you clone the Homepage Search widget

Change your client controller to:

function() {
   /* widget controller */
   var c = this;
   c.data.greeting = 'Hi ' + scope.user.first_name;
}

Then change your ng-bind value in the HTML template to   data.greeting

<h1 class="text-center text-4x m-b-lg sp-tagline-color" ng-bind="data.greeting"></h1>

[robertsduca]

The above should be marked as the correct answer! Thank you

[danielbrandao]

Hi Nicholas,

To expand on the solution Arnoud gave, it looks like you also wanted to add the greetings based on the time of day and include the search bar. I'd clone the Homepage Search widget and modify it with the following...

Try this in your Client Script:

    function() {

//Add greeting based on time of day and add user's first name

var c = this;

var today = new Date()

var curHr = today.getHours()

if (curHr < 12) {

  c.data.greeting = 'Good morning ' + scope.user.first_name;  

} else if (curHr < 18) {

  c.data.greeting = 'Good afternoon ' + scope.user.first_name;  

} else {  

  c.data.greeting = 'Good evening ' + scope.user.first_name;  

}  

}

Your HTML Template should look like this:

<div id="homepage-search" class="hidden-xs wrapper-xl">

  <div class="wrapper-xl">

<h1 class="text-center text-3x m-b-lg sp-tagline-color" ng-bind="data.greeting"></h1>  

  <h4 ng-if="options.short_description" class="text-center text-2x m-b-lg sp-tagline-color" ng-bind="options.short_description"></h4>

  <sp-widget widget="data.typeAheadSearch" />

  </div>

</div>

Your Server Script should look like this:

data.typeAheadSearch = $sp.getWidget('typeahead-search', options.typeahead_search);

This worked in my case but give me a thumbs up if this worked for you as well so I can check if it's specific to how I have my instance. Hope this helps!

-Dan