Sunday, November 10, 2013

SharePoint 2013 Work with user profile properties in apps for SharePoint

 SharePoint 2013 Work with user profile properties in apps for SharePoint
http://code.msdn.microsoft.com/office/SharePoint-2013-Work-with-99d43c17
vs2012 -> file -> new -> project c# -> office/SharePoint -> apps -> apps for SharePoint 2013 -> "SP_UserProfiles_js"

SP_UserProfiles_js -> Scripts -> Right Click -> Add -> Existing Item -> "SP.UserProfiles.js"

SP_UserProfiles_js -> Pages -> Default.aspx
Add Javascript "SP.UserProfiles.js" reference to "PlaceHolderAdditionalPageHead" placeholder in Default.aspx page
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <script type="text/javascript" src="../Scripts/jquery-1.8.2.min.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.runtime.js"></script>
    <script type="text/javascript" src="/_layouts/15/sp.js"></script>
    <link rel="Stylesheet" type="text/css" href="../Content/App.css" />
    <script type="text/javascript" src="../Scripts/App.js"></script>
    <script type="text/javascript" src="../Scripts/SP.UserProfiles.js"></script>
</asp:Content> 

SP_UserProfiles_js -> Pages -> Default.aspx
Add custom code to "PlaceHolderMain" placeholder in Default.aspx page
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <div>
        <p id="message">
            initializing...
        </p>
    </div>
    <div>
        <input id="listProfiles" type="button" value="Get My Profile" />
        <div id="profileList"></div>
    </div>

</asp:Content>

SP_UserProfiles_js -> Scripts -> App.js
Add Custom javascript code to App.js file
'use strict';
var context;
var peopleMgr;
var profileProperties;
var context = SP.ClientContext.get_current();
var user = context.get_web().get_currentUser();

$(document).ready(function () {
    getUserName();
    context = SP.ClientContext.get_current();
    $('#listProfiles').click(function () { listProfilesClick(); });
});
function getUserName() {
    context.load(user);
    context.executeQueryAsync(onGetUserNameSuccess, onGetUserNameFail);
}
function onGetUserNameSuccess() {
    $('#message').text('Hello ' + user.get_title());
}
function onGetUserNameFail(sender, args) {
    alert('Failed to get user name. Error:' + args.get_message());
}
function listProfilesClick() {
    peopleMgr = new SP.UserProfiles.PeopleManager(context);
    context.load(peopleMgr);
    profileProperties = peopleMgr.getMyProperties();
    context.load(profileProperties);
    context.executeQueryAsync(
        function () {
            $('#profileList').children().remove();
            var publicDiv = document.createElement("div");
            publicDiv.setAttribute("style", "float:none;padding:5px;");
            if (peopleMgr.get_isMyPeopleListPublic()) {
                publicDiv.appendChild(document.createTextNode("Your followers and those you follow are publicly visible"));
            }
            else {
                publicDiv.appendChild(document.createTextNode("Your followers and those you follow are not publicly visible"));
            }
            $('#profileList').append(publicDiv);
            var accountName = profileProperties.get_accountName();
            var accountDiv = document.createElement("div");
            accountDiv.setAttribute("style", "float:none;padding:5px;");
            accountDiv.appendChild(document.createTextNode("Your account: " + accountName));
            $('#profileList').append(accountDiv);
            var displayName = profileProperties.get_displayName();
            var displayNameDiv = document.createElement("div");
            displayNameDiv.setAttribute("style", "float:none;padding:5px;");
            if (displayName != null) {
                displayNameDiv.appendChild(document.createTextNode("Your display name: " + displayName));
            }
            else {
                displayNameDiv.appendChild(document.createTextNode("Your display name has not been set"));
            }
            $('#profileList').append(displayNameDiv);
            var myPicture = profileProperties.get_pictureUrl();
            var pictureDiv = document.createElement("div");
            pictureDiv.setAttribute("style", "float:none;padding:5px;");
            if (myPicture == null) {
                pictureDiv.appendChild(document.createTextNode("You have not set your picture"));
            }
            else {
                var myImage = document.createElement("img");
                myImage.setAttribute("src", myPicture);
                myImage.setAttribute("title", "You are a rare beauty!");
                myImage.setAttribute("alt", "Me, me, and me, me, me!");
                pictureDiv.appendChild(myImage);
            }
            $('#profileList').append(pictureDiv);
            var myProfileLink = peopleMgr.get_editProfileLink();
            var editProfileLink = document.createElement("a");
            editProfileLink.setAttribute("href", myProfileLink);
            editProfileLink.setAttribute("title", "Edit your profile");
            editProfileLink.setAttribute("target", "_blank");
            editProfileLink.appendChild(document.createTextNode("[Your Profile ] "));
            $('#profileList').append(editProfileLink);
            var myPersonalSite = profileProperties.get_personalUrl();
            var personalLink = document.createElement("a");
            personalLink.setAttribute("href", myPersonalSite);
            personalLink.setAttribute("title", "Go to your personal site");
            personalLink.setAttribute("target", "_blank");
            personalLink.appendChild(document.createTextNode("[Your Personal Site] "));
            $('#profileList').append(personalLink);
            var myPublicPersona = profileProperties.get_userUrl();
            var publicLink = document.createElement("a");
            publicLink.setAttribute("href", myPublicPersona);
            publicLink.setAttribute("title", "View your public persona");
            publicLink.setAttribute("target", "_blank");
            publicLink.appendChild(document.createTextNode("[Your Public Persona]"));
            $('#profileList').append(publicLink);
        },
        function (sender, e) {
            $('#profileList').children().remove();
            $('#profileList').append(docume.createTextNode(e.get_message()));
        });

}

SP_UserProfiles_js -> double click "AppManifest.xml"
Go to Permission tab in "AppManifest.xml" file and set "Scope" as "User Profile(Social)" and assign Permission as "Read"
Scope                                  Permission
----------------------------            -------------------
User Profile(Social)           Read

SP_UserProfiles_js -> Right Click -> Deploy
Thank You.

1 comment: