SharePoint 2013 search users/group auto complete with presence

Recently my client ask me to update the SharePoint 2013 search box to display the user/group with presence. Also on selection of user it should redirected to user profile page. I came up with SPSearchUserAutocomplete plugin to search user.

Features

• Update SharePoint 2013 search input box to search people with the presence
• Redirect to Profile page on selection [optional]
• Show user picture with presence [optional]

Prerequisites

• SharePoint 2013
• jQuery 1.8.x +
• jQuery UI JS 1.10.x
• jQuery UI CSS 1.10.x

Installation

• Copy jquery.searchpeople.js, imgPreload.js and spinner.gif to Site.
• Add reference to the page/masterpage
• Add following javascript

Settings

mySiteUrl :

My site url. User will redirect to profile page url. default: ""
e.g.  http://PROFILE_URL/person.aspx?accountname=NETWOR_ID 

redirectToProfilePage :

If true then user will be redirected to profile page url on selection. default: false

maxSuggetions :

Maximum suggestions to display. default: 10.

showpicture:

Show user picture. default: true

principalType:

Principal type to search. default: 0
options:
        0 - [User, DL, SecGroup, SPGroup]
        1 - [User]
        2 - [DL]
        4 - [SecGroup]
        8 - [SPGroup]

Search without picture

Search with picture

Contact card

jQuery search people also uses imgPreload plugin to show spinner before loading the user picture.

You can download the latest source code from codeplex