Wednesday, October 9, 2013

Find Number of Users Currently Logged on to a SharePoint Site (SP 2013 Online)

Find Number of Users Currently Logged on to a SharePoint 2013 Online using SPServices

Create sharepoint list with Name is WhoIsOnline.
Change Title to LastTimeUpdate. Create column user and group is UserName then input all user in your site collection to list (Note: LastTimeUpdate you can input text "Wed, 09 Oct 2013 08:40:48 GMT")

Download jquery-1.4.2.js and jquery.SPServices-0.6.2.min.js
Go to Settings >> Site contents >> Open Style Library >> Create new folder is MyJS

Then upload jquery-1.4.2.js and jquery.SPServices-0.6.2.min.js to MyJS folder (remember check in and publish your JS)

Now Open Sharepoint designer to connect to sharepoint 2013 online

Open seattle.html to code SPServices

Copy and paste this code before  <!--[if gte mso 9]><xml> and after <!--SPM:<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server"/>-->

Here is code
<!--Add javasript at here-->
        <script type="text/javascript" src="../../Style Library/MyJS/jquery-1.4.2.js">//<![CDATA[//]]>
        </script>
        <script type="text/javascript" src="../../Style Library/MyJS/jquery.SPServices-0.6.2.min.js">//<![CDATA[//]]>
        </script>
        <script type="text/javascript">//<![CDATA[
        $(document).ready(function () {
            window.setInterval(function () {
                GetListItems();
            }, 5000);
        });

        function GetListItems() {
            try {
                $().SPServices({
                    operation: "GetUserInfo",
                    async: false,
                    userLoginName: $().SPServices.SPGetCurrentUser(),
                    completefunc: function (xData, Status) {
                        $(xData.responseXML).find("User").each(function () {
                            //curUserId = $(this).attr("ID");
                            curUserName = $(this).attr("Name");
                            //curFullUserName = $(this).attr("ID") + ";#" + $(this).attr("Name");
                            $().SPServices({
                                operation: "GetListItems",
                                //webURL: "http://192.168.1.216:8800",
                                async: false,
                                listName: "WhoIsOnline",
                                CAMLViewFields: "<ViewFields><FieldRef Name='ID' /><FieldRef Name='Title' /><FieldRef Name='UserName' /><FieldRef Name='WhoIsOnline' /></ViewFields>",
                                CAMLQuery: "<Query><Where><Eq><FieldRef Name='UserName' /><Value Type='User'>" + curUserName + "</Value></Eq></Where></Query>",
                                completefunc: function (xData, Status) {
                                    //alert(xData.responseXML.xml);
                                    //$(xData.responseXML).find("z\\:row").each(function () {=>return undefied
                                    $(xData.responseXML).find("[nodeName=z:row]").each(function () {
                                        //var id = $(this).attr("ows_ID");
                                        var currentTime = new Date();                                      
                                        $().SPServices({
                                            operation: "UpdateListItems",
                                            listName: "WhoIsOnline",
                                            ID: $(this).attr("ows_ID"),
                                            valuepairs: [["Title", currentTime.toUTCString()]],
                                            debug: true,
                                            completefunc: null
                                        });
console.log(currentTime.toUTCString());
                                    });
                                }
                            });
                        });
                    }
                });
            }
            catch (e) { alert(e); }
        }
    //]]>
        </script>
Explain code
I use time to autorun update use login to my site collection. Get current user login then check the it with UserName in WhoIsOnline custom list if existing. update international time to Title (LastTimeUpdate)
Login with Hung Do Quoc and see the time before update

After auto update

Create new page and program to get user online with current international time - last update <= 20 second
Add CEWP to this page then paste this code to

Code here

​​<script type="text/javascript" src="/Style%20Library/MyJS/jquery-1.4.2.js"></script><script type="text/javascript" src="/Style%20Library/MyJS/jquery.SPServices-0.6.2.min.js"></script><script type="text/javascript">

    $(document).ready(function () {
        getUserOnline();
    });
    function getUserOnline() {
        try {
            $().SPServices({
                operation: "GetListItems",
                async: false,
                listName: "WhoIsOnline",
                CAMLViewFields: "<ViewFields><FieldRef Name='Title' /><FieldRef Name='UserName' /></ViewFields>",
                completefunc: function (xData, Status) {
                    var liHtml = "";
                    //$(xData.responseXML).find("z\\:row").each(function () {
                    $(xData.responseXML).find("[nodeName=z:row]").each(function () {
                        var lastTimeUpdate = new Date($(this).attr("ows_Title"));
                        var currentTimeFromServer = new Date();
                        console.log("Modified:" + lastTimeUpdate.toUTCString() + "- current: " + currentTimeFromServer.toUTCString());
                        // lastTimeUpdate
                        var lastTimeUpdateFullYear = parseInt(lastTimeUpdate.getFullYear());
                        var lastTimeUpdateMonth = parseInt(lastTimeUpdate.getMonth());
                        var lastTimeUpdateDate = parseInt(lastTimeUpdate.getDate());
                        var lastTimeUpdateHours = parseInt(lastTimeUpdate.getHours());
                        var lastTimeUpdateMinutes = parseInt(lastTimeUpdate.getMinutes());
                        var lastTimeUpdateSeconds = parseInt(lastTimeUpdate.getSeconds());
                        //currentTimeFromServer
                        var currentTimeFromServerFullYear = parseInt(currentTimeFromServer.getFullYear());
                        var currentTimeFromServerMonth = parseInt(currentTimeFromServer.getMonth());
                        var currentTimeFromServerDate = parseInt(currentTimeFromServer.getDate());
                        var currentTimeFromServerHours = parseInt(currentTimeFromServer.getHours());
                        var currentTimeFromServerMinutes = parseInt(currentTimeFromServer.getMinutes());
                        var currentTimeFromServerSeconds = parseInt(currentTimeFromServer.getSeconds());

                        var a = new Date(lastTimeUpdateFullYear, lastTimeUpdateMonth, lastTimeUpdateDate, lastTimeUpdateHours, lastTimeUpdateMinutes, lastTimeUpdateSeconds);
                        var b = new Date(currentTimeFromServerFullYear, currentTimeFromServerMonth, currentTimeFromServerDate, currentTimeFromServerHours, currentTimeFromServerMinutes, currentTimeFromServerSeconds);
                        if (b - a <= 20000) {
                            liHtml += ($(this).attr("ows_UserName")).split('#')[1] + "<br\>";
                        }
                    });
                    $("#useronline").html(liHtml);
                }
            });
        }
        catch (e) { alert(e); }
    }

    // 1000 which is millisecond for 1 second. Divide by this to get hours. (20.000 is valid)</script>
<div id="useronline">
</div>
Try to Login site with 3 users, Go back list WhoIsOnline you will see 3 users login (Modified: A few seconds ago <= 20 seconds with current time )

Go back your page you will see 3 users online

Note: I use the UTC time (international time). if you setting Regional settings in sharepoint, system still run correct. also you can apply this project for sharepoint server 2010, 2007....
Thanks.

5 comments:

  1. HI,
    I am not able to download the jquery-1.4.2.js and jquery.SPServices-0.6.2.min.js

    Could you please give me the correct link or jquery files.

    I am waiting for reply

    ReplyDelete
  2. Hi,
    I want to test this code in sharepoint 2007,so that could please provide me some ideas and Js files.

    ReplyDelete
  3. Hi,

    Thanks for your comment, it is available at https://www.mediafire.com/#hpct5ythguul4. if you can not download it, you can download from internet or send mail to me at quochung211187@gmail.com.

    Thanks

    ReplyDelete
  4. Hi, I want to display the count of the current online users for a site on sharepoint online. Please help me in providing solution for this, thanx in advance.

    ReplyDelete
  5. I am confused about which columns to create and which to change. You said to change Title to LastTimeUpdate and to create UserName, but I see Title referenced in CAMLFiewFields and another column, "WhoIsOnline" also mentioned. Would you please explain the columns again, please? Thanks.

    CAMLViewFields: 'ID', 'Title', 'UserName', 'WhoIsOnline'

    ReplyDelete