Tuesday, 15 October 2019

SharePoint online - Get List-item attachments and Display to div

Step 1 : Create a List ex: TestList and attach few images

Step 2 : Copy and Pastet the below coding in App.js
var Items = null;
'use strict';
var listItems;
var hostweburl = decodeURIComponent(getQueryStringParameter('SPHostUrl'));
var appweburl = decodeURIComponent(getQueryStringParameter('SPAppWebUrl'));
$(document).ready(function () {
    SP.SOD.executeFunc('sp.js', 'SP.ClientContext', ListItems)
});

function ListItems() {
    var context = new SP.ClientContext(appweburl);
    var ContextSite = new SP.AppContextSite(context, hostweburl);
    var web = ContextSite.get_web();
    context.load(web);
    var list = web.get_lists().getByTitle('TestList');
    var caml = new SP.CamlQuery();
    caml.set_viewXml("<View><Query><FieldRef Name='Title' /></Query></View>"); // U can 

    Items = list.getItems(SP.CamlQuery.createAllItemsQuery());
    context.load(Items, 'Include(AttachmentFiles)'); 
    context.executeQueryAsync(onSucceededCallback, onFailedCallback);
}

function onSucceededCallback(sender, args) {
    var enumerator = Items.getEnumerator();
    var myText = '';
    for (var i = 0; i < Items.get_count() ; i++) {
        var item = Items.getItemAtIndex(i);

        //print attachments
        var attachments = item.get_attachmentFiles();
        for (var j = 0; j < attachments.get_count() ; j++) {
            var attachment = attachments.getItemAtIndex(j);
          
            var img = new Image(150, 150);
            img.src = attachment.get_serverRelativeUrl();
            myDiv.appendChild(img);

            myText += attachment.get_serverRelativeUrl();
            console.log(attachment.get_serverRelativeUrl());
        }
    }
  
    
}

function onFailedCallback(sender, args) {
    var myText = '<p>The request failed: <br>';
    myText += 'Message: ' + args.get_message() + '<br>';
    myDiv.innerHTML = myText;
}

function getQueryStringParameter(paramToRetrieve) {
    var params = document.URL.split("?")[1].split("&");
    for (var i = 0; i < params.length; i = i + 1) {
        var singleParam = params[i].split("=");
        if (singleParam[0] == paramToRetrieve) return singleParam[1];
    }
}

Step 3: Copy and Paste the below coding in Default.aspx


<%@ Page Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c"MasterPageFile="~masterurl/default.master" Language="C#" %>

<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities"Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages"Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls"Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%-- The markup and script in the following Content element will be placed in the <head> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <script type="text/javascript" src="../Scripts/jquery-1.9.1.min.js"></script>
    <SharePoint:ScriptLink name="sp.js" runat="server" OnDemand="true" LoadAfterUI="true"Localizable="false" />
    <meta name="WebPartPageExpansion" content="full" />

    <!-- Add your CSS styles to the following file -->
    <link rel="Stylesheet" type="text/css" href="../Content/App.css" />

    <!-- Add your JavaScript to the following file -->
    <script type="text/javascript" src="../Scripts/App.js"></script>
</asp:Content>

<%-- The markup in the following Content element will be placed in the TitleArea of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
    Page Title
</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <div id="myDiv"></div>
    <div>
        <p id="message">
            <!-- The following content will be replaced with the user name when you run the app - see App.js -->         
        </p>
    </div>
</asp:Content>
Step 4: Appmainfest.xml

Give permission to Sitecollection - Full Control


Step 5: Deploy the Solution

Step 6:Final Result

at No comments:

Monday, 14 October 2019

SharePoint Online : Sharepoint Hosted App - People Picker Control using to insert and Show the Display Name in grid

Step 1:
Create a list in visual studio:



Step 2:
Create a fields like this




Step 3: Create one js file in the name of PeoplePicker.js
Step 4: Copy paste the below coding in PeoplePicker.js

PeoplePicker.js
--------------
var UserId;
var listname = "People";
var DisplayName;
$(document).ready(function () {
    initializePeoplePicker("UserName1");
    $('#btnSubmit').click(function (e) {
        PopulateGrid();
        if ($('#FilesGrid').html() == 'People') {
            addFile($('#UserName1').val());
            alert("UserNmae Adding to the Grid");
        }
        else {
            UpdateFiles($('#fileId').val());
        }
    });
});

function initializePeoplePicker(peoplePickerElementId) {
    var schema = {};
    schema['PrincipalAccountType'] = 'User,DL,SecGroup,SPGroup';
    schema['SearchPrincipalSource'] = 15;
    schema['ResolvePrincipalSource'] = 15;
    schema['AllowMultipleValues'] = false;
    schema['MaximumEntitySuggestions'] = 50;
    schema['Width'] = '250px';

    this.SPClientPeoplePicker_InitStandaloneControlWrapper(peoplePickerElementId, null, schema);
}

function saveUser() {
    ensureUser();
    $.ajax({
        url: _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('" + listname + "')/items",
        //_spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/getbytitle('" + listName + "')/items?$select=UserName1",
        type: "POST",
        async: false,
        data: JSON.stringify({
            __metadata: {
                type: "SP.Data.PeopleListItem"
            },
            UserName1Id: UserId,
            UserTitle: DisplayName

        }),

        headers: {
            "Accept": "application/json;odata=verbose",
            "Content-Type": "application/json;odata=verbose",
            "X-RequestDigest": $("#__REQUESTDIGEST").val(),
            "X-HTTP-Method": "POST",
        },
        success: function (data) {

            alert("User Name is saved successfully:" + data);
        },
        error: function (error) {
            alert(JSON.stringify(error));
        }
    });
    //alert("Yes");
}

function ensureUser() {
    var peoplePickerTopDivId = $('#UserName1').children().children().attr('id');
    var peoplePicker = this.SPClientPeoplePicker.SPClientPeoplePickerDict[peoplePickerTopDivId];
    var users = peoplePicker.GetAllUserInfo();

    var arryuser = users[0];

    if (arryuser) {
        var payload = { 'logonName': arryuser.Key };
        $.ajax({
            url: _spPageContextInfo.siteAbsoluteUrl + "/_api/web/ensureuser",
            type: "POST",
            async: false,
            contentType: "application/json;odata=verbose",
            data: JSON.stringify(payload),
            headers: {
                "Accept": "application/json;odata=verbose", "X-RequestDigest": $("#__REQUESTDIGEST").val()
            },
            success: function (data, status, xhr) {
                UserId = data.d.Id;
           
                //DisplayName = data.d.results.DisplayText;
                DisplayName = data.d.Title;
           
             
            },
            error: function (xhr, status, error) {

            }
        });
    }
    else {
        UserId = 0;
    }
}

function PopulateGrid() {
    //Clear datatables
    $('#FilesGrid').empty();
    //Get File list items
    $.ajax({
        url: "../_api/web/lists/GetByTitle('" + listname + "')/items",
        method: "GET",
        headers: {
            "accept": "application/json;odata=verbose"
        },
        success: function (data) {
            if (data.d.results.length > 0) {
                //construct HTML Table from the JSON Data
                $('#FilesGrid').append(GenerateTableFromJson(data.d.results));
                //Bind the HTML data with Jquery DataTable
                var oTable = $('#PeopleTable').dataTable({

                    //control which datatable options available
                    dom: 'Bfrltip',
                    //add select functionality to datatable
                    select: true,
                    //adjust column widths
                    "columns": [
                        null,
                        null,

                        { "width": "8%" }
                    ],
                    //remove sort icon from actions column
                    "aoColumnDefs": [
                        { "bSortable": false, "aTargets": [2] }
                    ]
                });
            } else {
                $('#FilesGrid').append("<span>No People Found.</span>");
            }
        },
        error: function (data) {
            $('#FilesGrid').append("<span>Error Retreiving People. Error : " + JSON.stringify(data) + "</span>");
        }
    });
};


//Generate html table values
function GenerateTableFromJson(objArray) {
 
 
    var tableContent =
        '<table id="PeopleTable"  class="table table-striped table-bordered" cellspacing="0" width="100%">' +
        '<thead><tr>' + '<th>ID</th>' + '<th>UserName</th>' + '</tr></thead>';
    for (var i = 0; i < objArray.length; i++) {
        tableContent += '<tr>';
        tableContent += '<td>' + objArray[i].Id + '</td>';
        tableContent += '<td>' + objArray[i].UserTitle + '</td>';         
        tableContent += '</tr>';
    }
    '</table>';
    return tableContent;
};

//Edit file function
function UpdateFiles(id) {
    var UserName1 = $("#UserName1").val();
    var eTag = $("#etag").val();
    var requestUri = "../_api/web/lists/getByTitle('" + listname + "')/items(" + id + ")";
    var requestHeaders = {
        "accept": "application/json;odata=verbose",
        "X-HTTP-Method": "MERGE",
        "X-RequestDigest": $('#__REQUESTDIGEST').val(),
        "If-Match": eTag
    }
    var fileData = {
        __metadata: { "type": "SP.Data.PeopleListItem" },
        UserName1: UserName1

    };
    var requestBody = JSON.stringify(fileData);

    return $.ajax({
        url: requestUri,
        type: "POST",
        contentType: "application/json;odata=verbose",
        headers: requestHeaders,
        data: requestBody
    });
}
//Add File function
var addFile = function (Username1) {

    var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('" + listname + "')/items",
        requestHeaders = {
            "accept": "application/json;odata=verbose",
            "content-type": "application/json;odata=verbose",
            "X-RequestDigest": $('#__REQUESTDIGEST').val()
        }
    var fileData = {
        __metadata: { "type": "SP.Data.PeopleListItem" },
        UserName1: Username1

    };
    var requestBody = JSON.stringify(fileData);
    return $.ajax({
        url: requestUri,
        type: "POST",
        headers: requestHeaders,
        data: requestBody,

    });

};

Default.aspx
----------------
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <link type="text/css" href="../Content/App.css" rel="Stylesheet" />
    <link type="text/css" href="../Content/toastr.css" rel="stylesheet" />
    <link type="text/css" href="../Content/bootstrap.css" rel="stylesheet" />
    <link type="text/css" href="../Content/bootstrap-dialog.css" rel="stylesheet" />
    <link type="text/css" href="../Content/DataTables/css/select.bootstrap.min.css" rel="stylesheet" />
    <link type="text/css" rel="stylesheet" href="https://cdn.datatables.net/1.10.8/css/jquery.dataTables.css" />
    <link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" />


</asp:Content>

<%-- The markup in the following Content element will be placed in the TitleArea of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
    People Picker ...

</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">
    <html>
    <head>
        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script type="text/javascript" src="../_layouts/15/clienttemplates.js"></script>
        <script type="text/javascript" src="../_layouts/15/clientforms.js"></script>
        <script type="text/javascript" src="../_layouts/15/clientpeoplepicker.js"></script>
        <script type="text/javascript" src="../_layouts/15/autofill.js"></script>
     
        <script type="text/javascript" src="../Scripts/PeoplePicker.js"></script>
    </head>
    <body>
        <div id="FormLable">
            <div id="toolbar">
                <button type="button" value="Files" class="btn btn-info" onclick="Javascript: location.href = '../Lists/People'"><span class='glyphicon glyphicon-upload'></span>People List</button>
         
            </div>
            <div id="FilesPanel">
                <table class="table" style="width: 100%;">
                    <tr>
                        <td>
                            <div id="FilesGrid" style="width: 100%"></div>
                        </td>
                    </tr>
                </table>
            </div>

            <div id="peoplepickerlable">
                <label>User Name:</label>
                <div id="UserName1" class="peoplepicker">
                </div>
            </div>

            <div>
                <button type="button" id="btnSubmit" onclick="saveUser()" style="margin-top: 10px;">Submit</button>
            </div>
        </div>

    </body>
    </html>

</asp:Content>

Final result :


at No comments:

Wednesday, 25 September 2019

SharePoint Online - Send E-mail from JavaScript using REST API

Script / App.js
-----------------

 <script type="text/javascript" src="//ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
  <script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
    <script type="text/javascript">
        //SUBJECT OF THE EMAIL
        //var subject = "SUBJECT OF THE MAIL";
        //CONTENT OF THE MAIL - CAN BE HTML OR PLAIN TEXT.
       // var mailContent = "<h3>Some Heading for the mail</h3><p>Content</p><div>Content</div>";
        //AN ARRAY HAVING THE RECIPIENT DETAILS.
        //THE USERNAME/EMAIL-ID SHOULD BE OF A VALID SHAREPOINT USER.
        //EXTERNAL USERS OR EXTERNAL EMAIL IDS ARE NOT SUPPORTED
       // var toList = ["DOMAIN\\USERNAME", "USER1-EMAIL-ID@DOMAIN.COM"]
        var userid = _spPageContextInfo.userId;
        var currentuseremail;
       
  var requestUri = _spPageContextInfo.webAbsoluteUrl + "/_api/web/getuserbyid(" + userid + ")";
  var requestHeaders = { "accept" : "application/json;odata=verbose" };
  $.ajax({
    url : requestUri,
    contentType : "application/json;odata=verbose",
    headers : requestHeaders,
    success : onSuccess,
    error : onError
  });

  function onSuccess(data, request){
    var loginName = data.d.Title;
      currentuseremail = data.d.Email;
        }
                                 
  function onError(error) {
    alert("error");
  }
        function processSendEmails() {
            var toList = [$("#txtRecipients").val()]
              var Emailcc = [currentuseremail]
            var body = $("#txtBody").val();
            var subject = $("#txtSubject").val();
            var mailContent = "<h3>Mail Heading </h3><p>" + body + "</p>";
            // Call sendEmail function     
            sendMail(toList,Emailcc, subject, mailContent).done(function (response) {
                alert("Mail Sent.");
             
            }).fail(function () {
                alert("Error while sending mail.");
            });

        }
        //Send-Email
        function sendMail(toList,Emailcc, subject, mailContent) {

        var restUrl = _spPageContextInfo.webAbsoluteUrl + "/_api/SP.Utilities.Utility.SendEmail",
        restHeaders = {
            "Accept": "application/json;odata=verbose",
            "X-RequestDigest": $("#__REQUESTDIGEST").val(),
            "Content-Type": "application/json;odata=verbose"
        },
        mailObject = {
            'properties': {
                '__metadata': {
                    'type': 'SP.Utilities.EmailProperties'
                },
                'To': {
                    'results': toList
                },
                 'CC': {
                    'results': Emailcc
                },
                'Subject': subject,
                'Body': mailContent,
                "AdditionalHeaders":
                    {
                        "__metadata":
                           { "type": "Collection(SP.KeyValue)" },
                        "results":
                        [
                            {
                                "__metadata": {
                                    "type": 'SP.KeyValue'
                                },
                                "Key": "content-type",
                                "Value": 'text/html',
                                "ValueType": "Edm.String"
                            }
                        ]
                    }

            }
        };
        return $.ajax({
            contentType: "application/json",
            url: restUrl,
            type: "POST",
            data: JSON.stringify(mailObject),
            headers: restHeaders
           
        });
    }

    </script>

Default.aspx
------------------

  <table>
        <tr>
            <td>User Name</td>
            <td>
                <input type="text" name="txtUserName" id="txtUserName" value="" /></td>
         
        </tr>
        <tr>
            <td>Email Id</td>
            <td>
                <input type="text" name="txtRecipients" id="txtRecipients" value="" />               
            </td>
        </tr>
        <tr>
            <td>Subject :
            </td>
            <td>
                <input type="text" name="txtSubject" id="txtSubject" value="" />
            </td>
        </tr>
        <tr>
            <td>Body :

            </td>
            <td>
                <input type="text" name="txtBody" id="txtBody" value="" />

            </td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td>
                <input id="Button1" onclick="processSendEmails()"  type="button" value="SendMail" />

             
            </td>
        </tr>         
    </table>
at No comments:

Custom MasterPage - SharePoint Online site provisioning solutions App using visual studio

Steps to set master page of host web from app web
1. Create a SharePoint hosted app and add a module named as "CustomMasterPage".
2. Download a copy of seattle.master from Master Page gallery.
3. Copy paste this file content into our modules .txt file and do custom changes on it as required (i have just changed the background color and image for demo).
 Tip: Don't change the extension file (.txt) in module otherwise it is not easy to read file content.
4. Refere sp.JS and sp.runtime.JS on default aspx page
5. below code copy paste on App.js
6. Deploy app
MasterPageModule/Elements

<?xml version="1.0" encoding="utf-8"?>
<Elements xmlns="http://schemas.microsoft.com/sharepoint/">
  <Module Name="MasterPageModule">
    <File Path="MasterPageModule\CustomAppMaster.txt" Url="MasterPageModule/CustomAppMaster.txt" Level="Published" ReplaceContent="TRUE" />
  </Module>

</Elements>



App.JS
-----------------------------------------


'use strict';
window.COB = window.COB || {};

window.COB.HostWebApp = function () {
    var hostWebUrl,
        appWebUrl,
        hostWebContext,
        destinationServerRelativeUrl,
        destinationFileName,

    // locate a file in the app web and retrieve the contents. If successful, provision to host web..
    readFromAppWebAndProvisionToHost = function (appPageUrl, hostWebServerRelativeUrl, hostWebFileName) {
        destinationServerRelativeUrl = hostWebServerRelativeUrl;
        destinationFileName = hostWebFileName;

        var req = $.ajax({
            url: appPageUrl,
            type: "GET",
            cache: false
        }).done(function (fileContents) {
            if (fileContents !== undefined && fileContents.length > 0) {
                uploadFileToHostWebViaCSOM(destinationServerRelativeUrl, destinationFileName, fileContents);
            }
            else {
                alert('Failed to read file from app web, so not uploading to host web..');
            }
        }).fail(function (jqXHR, textStatus) {
            alert("Request for page in app web failed: " + textStatus);
        });
    },

    // utility method for uploading files to host web..
    uploadFileToHostWebViaCSOM = function (serverRelativeUrl, filename, contents) {
        var createInfo = new SP.FileCreationInformation();
        createInfo.set_content(new SP.Base64EncodedByteArray());
        for (var i = 0; i < contents.length; i++) {

            createInfo.get_content().append(contents.charCodeAt(i));
        }
        createInfo.set_overwrite(true);
        createInfo.set_url(filename);
        var files = hostWebContext.get_web().getFolderByServerRelativeUrl(serverRelativeUrl).get_files();
        hostWebContext.load(files);
        files.add(createInfo);

        hostWebContext.executeQueryAsync(onProvisionFileSuccess, onProvisionFileFail);
    },
    onProvisionFileSuccess = function () {
        $('#message').append('<br /><div>File provisioned in host web successfully: ' + destinationServerRelativeUrl + '/' + destinationFileName + '</div>');
        var masterPageUrl = ["/", hostWebUrl.split("/")[3], "/", hostWebUrl.split("/")[4], "/", destinationServerRelativeUrl, "/", destinationFileName].join("");
        setMaster(masterPageUrl);
        //setMaster('/' + destinationServerRelativeUrl + '/' + destinationFileName);
    },
    onProvisionFileFail = function (sender, args) {
        alert('Failed to provision file into host web. Error:' + sender.statusCode);
    },

    // set master page on host web..
    setMaster = function (masterUrl) {
        var hostWeb = hostWebContext.get_web();
       // hostWeb.set_masterUrl(masterUrl);       
        hostWeb.set_customMasterUrl(masterUrl);
        hostWeb.set_masterUrl(masterUrl);
        hostWeb.update();       
        hostWebContext.load(hostWeb);
        hostWebContext.executeQueryAsync(onSetMasterSuccess, onSetMasterFail);
    },
    onSetMasterSuccess = function () {
        $('#message').append('<br /><div>Master page updated successfully..</div>');
    },
    onSetMasterFail = function (sender, args) {
        alert('Failed to update master page on host web. Error:' + args.get_message());
    },

    init = function () {
        var hostWebUrlFromQS = $.getUrlVar("SPHostUrl");
        hostWebUrl = (hostWebUrlFromQS !== undefined) ? decodeURIComponent(hostWebUrlFromQS) : undefined;

        var appWebUrlFromQS = $.getUrlVar("SPAppWebUrl");
        appWebUrl = (appWebUrlFromQS !== undefined) ? decodeURIComponent(appWebUrlFromQS) : undefined;
    }

    return {
        execute: function () {
            init();

            hostWebContext = new SP.ClientContext(window.COB.AppHelper.getRelativeUrlFromAbsolute(hostWebUrl));
            readFromAppWebAndProvisionToHost(appWebUrl + '/MasterPageModule/CustomAppMaster.txt', '_catalogs/masterpage', 'CustomAppMaster.master');
        }
    }
}();
jQuery.extend({  
    getUrlVars: function () {  
        var vars = [], hash;  
        var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');  
        for (var i = 0; i < hashes.length; i++) {  
            hash = hashes[i].split('=');  
            vars.push(hash[0]);  
            vars[hash[0]] = hash[1];  
        }  
        return vars;  
    },  
    getUrlVar: function (name) {  
        return jQuery.getUrlVars()[name];  
    }  
});
window.COB.AppHelper = {
    getRelativeUrlFromAbsolute: function (absoluteUrl) {
        absoluteUrl = absoluteUrl.replace('https://', '');
        var parts = absoluteUrl.split('/');
        var relativeUrl = '/';
        for (var i = 1; i < parts.length; i++) {
            relativeUrl += parts[i] + '/';
        }
        return relativeUrl;
    },
};
$(document).ready(function () {   
    window.COB.HostWebApp.execute();
});


default.aspx
------------------------

<%-- The following 4 lines are ASP.NET directives needed when using SharePoint components --%>

<%@ Page Inherits="Microsoft.SharePoint.WebPartPages.WebPartPage, Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" MasterPageFile="~masterurl/default.master" Language="C#" %>

<%@ Register TagPrefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=15.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

<%-- The markup and script in the following Content element will be placed in the <head> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderAdditionalPageHead" runat="server">
    <script type="text/javascript" src="../Scripts/jquery-1.9.1.min.js"></script>
    <SharePoint:ScriptLink name="sp.js" runat="server" OnDemand="true" LoadAfterUI="true" Localizable="false" />
    <meta name="WebPartPageExpansion" content="full" />

    <!-- Add your CSS styles to the following file -->
    <link rel="Stylesheet" type="text/css" href="../Content/App.css" />

    <!-- Add your JavaScript to the following file -->
    <script src="/_layouts/15/MicrosoftAjax.js" type="text/javascript"></script>
    <script src="/_layouts/15/sp.core.js" type="text/javascript"></script>
    <script src="/_layouts/15/sp.runtime.js" type="text/javascript"></script>
    <script src="/_layouts/15/sp.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Scripts/App.js"></script>
</asp:Content>

<%-- The markup in the following Content element will be placed in the TitleArea of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderPageTitleInTitleArea" runat="server">
    Page Title
</asp:Content>

<%-- The markup and script in the following Content element will be placed in the <body> of the page --%>
<asp:Content ContentPlaceHolderID="PlaceHolderMain" runat="server">

    <div >
        <p id="message">
            <!-- The following content will be replaced with the user name when you run the app - see App.js -->
            initializing...
        </p>
    </div>

</asp:Content>


CustomAppMaster.txt / CustomAppMaster.master
-----------------------------------------------------------------------
<%@Master language="C#"%>
<%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="Utilities" Namespace="Microsoft.SharePoint.Utilities" Assembly="Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Import Namespace="Microsoft.SharePoint" %> <%@ Assembly Name="Microsoft.Web.CommandUI, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Import Namespace="Microsoft.SharePoint.ApplicationPages" %>
<%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=16.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="wssuc" TagName="Welcome" src="~/_controltemplates/15/Welcome.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<SharePoint:SPHtmlTag dir="<%$Resources:wss,multipages_direction_dir_value%>" ID="SPHtmlTag" runat="server" >
<head runat="server">
<meta name="GENERATOR" content="Microsoft SharePoint" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<SharePoint:IECompatibleMetaTag runat="server" />
<meta http-equiv="Expires" content="0" />
<SharePoint:SPPinnedSiteTile runat="server" TileUrl="/_layouts/15/images/SharePointMetroAppTile.png" TileColor="#0072C6" />
<SharePoint:RobotsMetaTag runat="server"/>
<SharePoint:PageTitle runat="server">
<asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server">
<SharePoint:ProjectProperty Property="Title" runat="server" />
</asp:ContentPlaceHolder>
</SharePoint:PageTitle>
<SharePoint:SPShortcutIcon runat="server" IconUrl="/_layouts/15/images/favicon.ico?rev=47" />
<SharePoint:StartScript runat="server" />
<SharePoint:CssLink runat="server" Version="15"/>
<SharePoint:ScriptLink language="javascript" name="core.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="menu.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="callout.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="sharing.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:ScriptLink language="javascript" name="suitelinks.js" OnDemand="true" runat="server" Localizable="false" />
<SharePoint:CustomJSUrl runat="server" />
<SharePoint:SoapDiscoveryLink runat="server" />
<SharePoint:AjaxDelta id="DeltaPlaceHolderAdditionalPageHead" Container="false" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server" />
<SharePoint:DelegateControl runat="server" ControlId="AdditionalPageHead" AllowMultipleControls="true" />
<asp:ContentPlaceHolder id="PlaceHolderBodyAreaClass" Visible="true" runat="server" />
</SharePoint:AjaxDelta>
<SharePoint:CssRegistration Name="Themable/corev15.css" runat="server" />
</head>
<body style="background-color:greenyellow">
  <SharePoint:ImageLink runat="server"/>
  <SharePoint:SPNoScript runat="server"/>
  <SharePoint:SPClientIDGenerator runat="server" ServerControlID="DeltaPlaceHolderMain;DeltaPlaceHolderPageTitleInTitleArea;DeltaPlaceHolderUtilityContent" />
  <SharePoint:SharePointForm runat="server" onsubmit="if (typeof(_spFormOnSubmitWrapper) != 'undefined') {return _spFormOnSubmitWrapper();} else {return true;}">
<script type="text/javascript"> var submitHook = function () { return false; }; theForm._spOldSubmit = theForm.submit; theForm.submit = function () { if (!submitHook()) { this._spOldSubmit(); } }; </script>
<SharePoint:AjaxDelta id="DeltaSPWebPartManager" runat="server">
<WebPartPages:SPWebPartManager runat="Server" />
</SharePoint:AjaxDelta>
<asp:ScriptManager id="ScriptManager" runat="server" EnablePageMethods="false" EnablePartialRendering="true" EnableScriptGlobalization="false" EnableScriptLocalization="true" />
<SharePoint:AjaxDelta id="DeltaDelegateControls" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="GlobalNavigation" />
<SharePoint:DelegateControl ControlId="GlobalSiteLink3" Scope="Farm" runat="server" Visible="false" />
</SharePoint:AjaxDelta>
<div id="TurnOnAccessibility" style="display:none" class="s4-notdlg noindex">
<a id="linkTurnOnAcc" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,master_turnonaccessibility%>' EncodeMethod='HtmlEncode'/>" href="#" class="ms-accessible ms-acc-button" onclick="SetIsAccessibilityFeatureEnabled(true);UpdateAccessibilityUI();document.getElementById('linkTurnOffAcc').focus();return false;"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,master_turnonaccessibility%>" EncodeMethod="HtmlEncode"/></a>
</div>
<div id="TurnOffAccessibility" style="display:none" class="s4-notdlg noindex">
<a id="linkTurnOffAcc" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,master_turnoffaccessibility%>' EncodeMethod='HtmlEncode'/>" href="#" class="ms-accessible ms-acc-button" onclick="SetIsAccessibilityFeatureEnabled(false);UpdateAccessibilityUI();document.getElementById('linkTurnOnAcc').focus();return false;"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,master_turnoffaccessibility%>" EncodeMethod="HtmlEncode"/></a>
</div>
<div class="s4-notdlg s4-skipribbonshortcut noindex">
<a href="javascript:;" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,skipRibbonCommandsLink%>' EncodeMethod='HtmlEncode'/>" onclick="document.getElementById('startNavigation').focus();" class="ms-accessible ms-acc-button" accesskey="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,skipribbon_accesskey%>' EncodeMethod='HtmlEncode'/>"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,skipRibbonCommandsLink%>" EncodeMethod="HtmlEncode"/></a>
</div>
<div class="s4-notdlg noindex">
<a href="javascript:;" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,mainContentLink%>' EncodeMethod='HtmlEncode'/>" onclick="document.getElementById('mainContent').focus();" class="ms-accessible ms-acc-button"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,mainContentLink%>" EncodeMethod="HtmlEncode"/></a>
</div>
<div id="TurnOffAnimation" style="display:none;" class="s4-notdlg noindex">
<a id="linkTurnOffAnimation" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,master_disableanimation%>' EncodeMethod='HtmlEncode'/>" href="#" class="ms-accessible ms-acc-button" onclick="ToggleAnimationStatus();return false;"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,master_disableanimation%>" EncodeMethod="HtmlEncode"/></a>
</div>
<div id="TurnOnAnimation" style="display:none;" class="s4-notdlg noindex">
<a id="linkTurnOnAnimation" title="<SharePoint:EncodedLiteral runat='server' text='<%$Resources:wss,master_enableanimation%>' EncodeMethod='HtmlEncode'/>" href="#" class="ms-accessible ms-acc-button" onclick="ToggleAnimationStatus();return false;"><SharePoint:EncodedLiteral runat="server" text="<%$Resources:wss,master_enableanimation%>" EncodeMethod="HtmlEncode"/></a>
</div>
<a id="HiddenAnchor" href="javascript:;" style="display:none;"></a>
<SharePoint:AjaxDelta runat="server" id="suiteBarDelta" BlockElement="true" CssClass="ms-dialogHidden ms-fullWidth noindex">
<div id="suiteMenuData" class="ms-hide">
<wssuc:Welcome id="IdWelcomeData" runat="server" EnableViewState="false" RenderDataOnly="true"/>
   <span class="ms-siteactions-root" id="siteactiontd">
   <SharePoint:SiteActions runat="server" accesskey="<%$Resources:wss,tb_SiteActions_AK%>"
id="SiteActionsMenuMainData"
PrefixHtml=""
SuffixHtml=""
ImageUrl="/_layouts/15/images/spcommon.png?rev=47"
ThemeKey="spcommon"
MenuAlignment="Right"
LargeIconMode="false"
>
<CustomTemplate>
<SharePoint:Menu runat="server" Visible="false"/>
<SharePoint:FeatureMenuTemplate runat="server"
FeatureScope="Site"
Location="Microsoft.SharePoint.StandardMenu"
GroupId="SiteActions"
UseShortId="true"
>
  <SharePoint:MenuItemTemplate runat="server"
  id="MenuItem_ShareThisSite"
  Text="<%$Resources:wss,siteactions_sharethissite%>"
  Description="<%$Resources:wss,siteactions_sharethissitedescription%>"
  MenuGroupId="100"
  Sequence="110"
  UseShortId="true"
  PermissionsString="ViewPages"
  PermissionMode="Any" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_EditPage"
  Text="<%$Resources:wss,siteactions_editpage15%>"
  Description="<%$Resources:wss,siteactions_editpagedescriptionv4%>"
  ImageUrl="/_layouts/15/images/ActionsEditPage.png?rev=47"
  MenuGroupId="200"
  Sequence="210"
  PermissionsString="EditListItems"
  ClientOnClickNavigateUrl="javascript:ChangeLayoutMode(false);" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_CreatePage"
  Text="<%$Resources:wss,siteactions_addpage15%>"
  Description="<%$Resources:wss,siteactions_createpagedesc%>"
  ImageUrl="/_layouts/15/images/NewContentPageHH.png?rev=47"
  MenuGroupId="200"
  Sequence="220"
  UseShortId="true"
  ClientOnClickScriptContainingPrefixedUrl="OpenCreateWebPageDialog('~siteLayouts/createwebpage.aspx')"
  PermissionsString="AddListItems, EditListItems"
  PermissionMode="All" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_Create"
  Text="<%$Resources:wss,siteactions_addapp15%>"
  Description="<%$Resources:wss,siteactions_createdesc%>"
  MenuGroupId="200"
  Sequence="230"
  UseShortId="true"
  ClientOnClickScriptContainingPrefixedUrl="GoToPage('~siteLayouts/addanapp.aspx')"
  PermissionsString="ManageLists, ManageSubwebs"
  PermissionMode="Any" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_ViewAllSiteContents"
  Text="<%$Resources:wss,quiklnch_allcontent_15%>"
  Description="<%$Resources:wss,siteactions_allcontentdescription%>"
  ImageUrl="/_layouts/15/images/allcontent32.png?rev=47"
  MenuGroupId="200"
  Sequence="240"
  UseShortId="true"
  ClientOnClickNavigateUrl="~siteLayouts/viewlsts.aspx"
  PermissionsString="ViewFormPages"
  PermissionMode="Any" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_ChangeTheLook"
  Text="<%$Resources:wss,siteactions_changethelook15%>"
  Description="<%$Resources:wss,siteactions_changethelookdesc15%>"
  MenuGroupId="300"
  Sequence="310"
  UseShortId="true"
  ClientOnClickNavigateUrl="~siteLayouts/designgallery.aspx"
  PermissionsString="ApplyThemeAndBorder,ApplyStyleSheets,Open,ViewPages,OpenItems,ViewListItems"
  PermissionMode="All" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_Settings"
  Text="<%$Resources:wss,siteactions_settings15%>"
  Description="<%$Resources:wss,siteactions_sitesettingsdescriptionv4%>"
  ImageUrl="/_layouts/15/images/settingsIcon.png?rev=47"
  MenuGroupId="300"
  Sequence="320"
  UseShortId="true"
  ClientOnClickScriptContainingPrefixedUrl="GoToPage('~siteLayouts/settings.aspx')"
  PermissionsString="EnumeratePermissions,ManageWeb,ManageSubwebs,AddAndCustomizePages,ApplyThemeAndBorder,ManageAlerts,ManageLists,ViewUsageData"
  PermissionMode="Any" />
  <SharePoint:MenuItemTemplate runat="server" id="MenuItem_SwitchToMobileView"
  Visible="false"
  Text="<%$Resources:wss,siteactions_switchtomobileview%>"
  Description="<%$Resources:wss,siteactions_switchtomobileviewdesc%>"
  MenuGroupId="300"
  Sequence="330"
  UseShortId="true"
  ClientOnClickScript="STSNavigate(StURLSetVar2(ajaxNavigate.get_href(), 'mobile', '1'));" />
</SharePoint:FeatureMenuTemplate>
</CustomTemplate>
  </SharePoint:SiteActions></span>
</div>
<SharePoint:ScriptBlock runat="server">
var g_navBarHelpDefaultKey = "HelpHome";
</SharePoint:ScriptBlock>
<SharePoint:DelegateControl id="ID_SuiteBarDelegate" ControlId="SuiteBarDelegate" runat="server" />
</SharePoint:AjaxDelta>
<div id="ms-hcTest"></div>
<div id="s4-ribbonrow">
<div id="globalNavBox" class="noindex">
<div id="ribbonBox">
<div id="s4-ribboncont">
<SharePoint:AjaxDelta id="DeltaSPRibbon" BlockElement="true" runat="server">
<SharePoint:DelegateControl runat="server" ID="GlobalDelegate0" ControlId="GlobalSiteLink0" />
<SharePoint:SPRibbon
runat="server"
PlaceholderElementId="RibbonContainer"
CssFile="" >
<SharePoint:SPRibbonPeripheralContent
runat="server"
CssClass="ms-core-defaultFont ms-dialogHidden"
Location="TabRowLeft">
</SharePoint:SPRibbonPeripheralContent>
<SharePoint:SPRibbonPeripheralContent
runat="server"
Location="TabRowRight"
ID="RibbonTabRowRight"
CssClass="s4-trc-container s4-notdlg ms-core-defaultFont">
<SharePoint:SPSharePromotedActionButton runat="server"/>
<SharePoint:DelegateControl runat="server" ControlId="PromotedActions" AllowMultipleControls="true" />
<SharePoint:SPSyncPromotedActionButton runat="server"/>
<SharePoint:PageStateActionButton id="PageStateActionButton" runat="server" Visible="false" />
<span id="fullscreenmodebox" class="ms-qatbutton">
<span id="fullscreenmode">
<SharePoint:ThemedClusteredHoverImage
runat="server"
ID="fullscreenmodeBtn"
ThemeKey="spcommon"
TouchMode="true"
TouchModeWidth="30"
TouchModeHeight="30"
TouchModePaddingLeft="7"
TouchModePaddingTop="7"
TouchModePaddingRight="7"
TouchModePaddingBottom="7"
ImageUrl="/_layouts/15/images/spcommon.png?rev=47"
Width="16"
Height="16"
OffsetX="143"
OffsetY="178"
HoverOffsetX="125"
HoverOffsetY="178"
NavigateUrl="#"
onclick="SetFullScreenMode(true);PreventDefaultNavigation();return false;"
AlternateText="<%$Resources:wss,multipages_fullscreenmodelinkalt_text%>"
ToolTip="<%$Resources:wss,multipages_fullscreenmodelinkalt_text%>"
/>
</span>
<span id="exitfullscreenmode" style="display: none;">
<SharePoint:ThemedClusteredHoverImage
runat="server"
ID="exitfullscreenmodeBtn"
ThemeKey="spcommon"
TouchMode="true"
TouchModeWidth="30"
TouchModeHeight="30"
TouchModePaddingLeft="7"
TouchModePaddingTop="7"
TouchModePaddingRight="7"
TouchModePaddingBottom="7"
ImageUrl="/_layouts/15/images/spcommon.png?rev=47"
Width="16"
Height="16"
OffsetX="107"
OffsetY="178"
HoverOffsetX="179"
HoverOffsetY="96"
NavigateUrl="#"
onclick="SetFullScreenMode(false);PreventDefaultNavigation();return false;"
AlternateText="<%$Resources:wss,multipages_fullscreenmodelinkalt_text%>"
ToolTip="<%$Resources:wss,multipages_fullscreenmodelinkalt_text%>"
/>
</span>
</span>
<SharePoint:DeveloperDashboard runat="server" />
<SharePoint:DeveloperDashboardLauncher
ID="DeveloperDashboardLauncher"
ThemeKey="spcommon"
TouchMode="true"
TouchModeWidth="30"
TouchModeHeight="30"
TouchModePaddingLeft="7"
TouchModePaddingTop="7"
TouchModePaddingRight="7"
TouchModePaddingBottom="7"
NavigateUrl="javascript:return false"
OnClick="ToggleDeveloperDashboard(window.g_ddHostBase);return false"
OuterCssClass="ms-dd-button ms-qatbutton"
runat="server"
ImageUrl="/_layouts/15/images/spcommon.png?rev=47"
AlternateText="<%$Resources:wss,multipages_launchdevdashalt_text%>"
ToolTip="<%$Resources:wss,multipages_launchdevdashalt_text%>"
OffsetX="145"
OffsetY="196"
HoverOffsetX="163"
HoverOffsetY="196"
Height="16"
Width="16" />
</SharePoint:SPRibbonPeripheralContent>
</SharePoint:SPRibbon>
</SharePoint:AjaxDelta>
</div>
<SharePoint:AjaxDelta id="DeltaSPNavigation" runat="server">
<asp:ContentPlaceHolder ID="SPNavigation" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="PublishingConsole" Id="PublishingConsoleDelegate" />
</asp:ContentPlaceHolder>
</SharePoint:AjaxDelta>
</div>
<SharePoint:AjaxDelta id="DeltaWebPartAdderUpdatePanelContainer" BlockElement="true" CssClass="ms-core-webpartadder" runat="server">
  <div id="WebPartAdderUpdatePanelContainer">
<asp:UpdatePanel
ID="WebPartAdderUpdatePanel"
UpdateMode="Conditional"
ChildrenAsTriggers="false"
runat="server">
  <ContentTemplate>
<WebPartPages:WebPartAdder ID="WebPartAdder" runat="server" />
  </ContentTemplate>
  <Triggers>
<asp:PostBackTrigger ControlID="WebPartAdder" />
  </Triggers>
</asp:UpdatePanel>
  </div>
</SharePoint:AjaxDelta>
</div>
</div>
<div id="s4-workspace" class="ms-core-overlay">
<div id="s4-bodyContainer">
<div id="s4-titlerow"
class="ms-dialogHidden s4-titlerowhidetitle">
<div id="titleAreaBox"
class="ms-noList ms-table ms-core-tableNoSpace">
<div id="titleAreaRow"
class="ms-tableRow">
<div id="siteIcon" class="ms-tableCell ms-verticalAlignTop">
<SharePoint:AjaxDelta id="DeltaSiteLogo" BlockElement="true" runat="server">
<SharePoint:SPSimpleSiteLink CssClass="ms-siteicon-a" runat="server" id="onetidProjectPropertyTitleGraphic" >
<SharePoint:SiteLogoImage CssClass="ms-siteicon-img" name="onetidHeadbnnr0" id="onetidHeadbnnr2" LogoImageUrl="/_layouts/15/images/siteIcon.png?rev=47" runat="server"/>
</SharePoint:SPSimpleSiteLink>
</SharePoint:AjaxDelta>
</div>
<div class="ms-breadcrumb-box ms-tableCell ms-verticalAlignTop">
<div
class="ms-breadcrumb-top">
<div class="ms-breadcrumb-dropdownBox" style="display:none;">
<SharePoint:AjaxDelta id="DeltaBreadcrumbDropdown" runat="server">
<SharePoint:PopoutMenu
Visible="false"
runat="server"
ID="GlobalBreadCrumbNavPopout"
IconUrl="/_layouts/15/images/spcommon.png?rev=47"
IconAlt="<%$Resources:wss,master_breadcrumbIconAlt%>"
ThemeKey="v15breadcrumb"
IconOffsetX="215"
IconOffsetY="120"
IconWidth="16"
IconHeight="16"
AnchorCss="ms-breadcrumb-anchor"
AnchorOpenCss="ms-breadcrumb-anchor-open"
MenuCss="ms-breadcrumb-menu ms-noList">
<div class="ms-breadcrumb-top">
<asp:Label runat="server" CssClass="ms-breadcrumb-header" Text="<%$Resources:wss,master_breadcrumbHeader%>" />
</div>
<asp:ContentPlaceHolder id="PlaceHolderTitleBreadcrumb" runat="server">
<SharePoint:ListSiteMapPath
runat="server"
SiteMapProviders="SPSiteMapProvider,SPContentMapProvider"
RenderCurrentNodeAsLink="false"
PathSeparator=""
CssClass="ms-breadcrumb"
NodeStyle-CssClass="ms-breadcrumbNode"
CurrentNodeStyle-CssClass="ms-breadcrumbCurrentNode"
RootNodeStyle-CssClass="ms-breadcrumbRootNode"
NodeImageOffsetX="217"
NodeImageOffsetY="210"
NodeImageWidth="16"
NodeImageHeight="16"
NodeImageUrl="/_layouts/15/images/spcommon.png?rev=47"
RTLNodeImageOffsetX="199"
RTLNodeImageOffsetY="210"
RTLNodeImageWidth="16"
RTLNodeImageHeight="16"
RTLNodeImageUrl="/_layouts/15/images/spcommon.png?rev=47"
HideInteriorRootNodes="true"
SkipLinkText="" />
</asp:ContentPlaceHolder>
</SharePoint:PopoutMenu>
</SharePoint:AjaxDelta>
</div>
<SharePoint:AjaxDelta id="DeltaTopNavigation" BlockElement="true" CssClass="ms-displayInline ms-core-navigation" role="navigation" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="TopNavigationDataSource" Id="topNavigationDelegate">
<Template_Controls>
<asp:SiteMapDataSource
ShowStartingNode="False"
SiteMapProvider="SPNavigationProvider"
id="topSiteMap"
runat="server"
StartingNodeUrl="sid:1002"/>
</Template_Controls>
</SharePoint:DelegateControl>
<asp:ContentPlaceHolder id="PlaceHolderTopNavBar" runat="server">
<SharePoint:AspMenu
ID="TopNavigationMenu"
Runat="server"
EnableViewState="false"
DataSourceID="topSiteMap"
AccessKey="<%$Resources:wss,navigation_accesskey%>"
UseSimpleRendering="true"
UseSeparateCss="false"
Orientation="Horizontal"
StaticDisplayLevels="2"
AdjustForShowStartingNode="true"
MaximumDynamicDisplayLevels="2"
SkipLinkText="" />
</asp:ContentPlaceHolder>
</SharePoint:AjaxDelta>
</div>
<h1 id="pageTitle" class="ms-core-pageTitle">
  <SharePoint:AjaxDelta id="DeltaPlaceHolderPageTitleInTitleArea" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderPageTitleInTitleArea" runat="server">
  <SharePoint:SPTitleBreadcrumb
  runat="server"
  RenderCurrentNodeAsLink="true"
  SiteMapProvider="SPContentMapProvider"
  CentralAdminSiteMapProvider="SPXmlAdminContentMapProvider"
  SkipLinkText="">
<PATHSEPARATORTEMPLATE>
  <SharePoint:ClusteredDirectionalSeparatorArrow runat="server" />
</PATHSEPARATORTEMPLATE>
  </SharePoint:SPTitleBreadcrumb>
</asp:ContentPlaceHolder>
  </SharePoint:AjaxDelta>
  <SharePoint:AjaxDelta BlockElement="true" id="DeltaPlaceHolderPageDescription" CssClass="ms-displayInlineBlock ms-normalWrap" runat="server">
<a href="javascript:;" id="ms-pageDescriptionDiv" style="display:none;" data-accessibility-nocheck="true">
  <span id="ms-pageDescriptionImage">&#160;</span>
</a>
<span class="ms-accessible" id="ms-pageDescription">
  <asp:ContentPlaceHolder id="PlaceHolderPageDescription" runat="server" />
</span>
<SharePoint:ScriptBlock runat="server">
  _spBodyOnLoadFunctionNames.push("setupPageDescriptionCallout");
</SharePoint:ScriptBlock>
  </SharePoint:AjaxDelta>
</h1>
</div>
<div class="ms-tableCell ms-verticalAlignTop">
<SharePoint:AjaxDelta id="DeltaPlaceHolderGroupActionsArea" BlockElement="true" CssClass="ms-floatRight ms-noWrap" runat="server">
  <SharePoint:DelegateControl runat="server" ControlId="GroupActionsTop" AllowMultipleControls="true" />
</SharePoint:AjaxDelta>
</div>
<div class="ms-tableCell ms-verticalAlignTop">
<SharePoint:AjaxDelta id="DeltaPlaceHolderSearchArea" BlockElement="true" CssClass="ms-mpSearchBox ms-floatRight" runat="server">
  <asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">
<SharePoint:FlightedContent runat="server" ExpFeature="Reserved_Server_ExpFeature30731" RenderIfInFlight="true">
  <SharePoint:WebTemplateBasedContent runat="server" WebTemplates="STS|BLANKINTERNET|CMSPUBLISHING|GROUP" RenderIfInWebTemplates="false">
<div id="searchInputBox">
  <SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox" />
</div>
  </SharePoint:WebTemplateBasedContent>
</SharePoint:FlightedContent>
<SharePoint:FlightedContent runat="server" ExpFeature="Reserved_Server_ExpFeature30731" RenderIfInFlight="false">
<div id="searchInputBox">
  <SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox" />
</div>
</SharePoint:FlightedContent>
  </asp:ContentPlaceHolder>
</SharePoint:AjaxDelta>
</div>
</div>
</div>
</div>
<div id="contentRow">
<div id="sideNavBox"
role="Navigation"
class="ms-dialogHidden ms-forceWrap ms-noList">
  <SharePoint:AjaxDelta id="DeltaPlaceHolderLeftNavBar" BlockElement="true" CssClass="ms-core-navigation" role="navigation" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderLeftNavBar" runat="server">
<SharePoint:DelegateControl runat="server" ControlId="QuickLaunchTop"/>
<a id="startNavigation" name="startNavigation" tabIndex="-1"></a>
<asp:ContentPlaceHolder id="PlaceHolderLeftNavBarTop" runat="server" />
<asp:ContentPlaceHolder id="PlaceHolderQuickLaunchTop" runat="server" />
<asp:ContentPlaceHolder id="PlaceHolderLeftNavBarDataSource" runat="server" />
<asp:ContentPlaceHolder id="PlaceHolderCalendarNavigator" runat="server" />
<asp:ContentPlaceHolder id="PlaceHolderLeftActions" runat="server" />
<div class="ms-core-sideNavBox-removeLeftMargin">
<SharePoint:SPNavigationManager
id="QuickLaunchNavigationManager"
runat="server"
QuickLaunchControlId="V4QuickLaunchMenu"
ContainedControl="QuickLaunch"
EnableViewState="false"
>
<SharePoint:DelegateControl runat="server"
ControlId="QuickLaunchDataSource">
<Template_Controls>
<asp:SiteMapDataSource
SiteMapProvider="SPNavigationProvider"
ShowStartingNode="False"
id="QuickLaunchSiteMap"
StartingNodeUrl="sid:1025"
runat="server"
/>
</Template_Controls>
</SharePoint:DelegateControl>
<SharePoint:AspMenu
id="V4QuickLaunchMenu"
runat="server"
EnableViewState="false"
DataSourceId="QuickLaunchSiteMap"
UseSimpleRendering="true"
Orientation="Vertical"
StaticDisplayLevels="3"
AdjustForShowStartingNode="true"
MaximumDynamicDisplayLevels="0"
SkipLinkText=""
/>
</SharePoint:SPNavigationManager>
<SharePoint:SPNavigationManager
id="TreeViewNavigationManagerV4"
runat="server"
ContainedControl="TreeView"
CssClass="ms-tv-box"
>
<SharePoint:SPLinkButton runat="server" NavigateUrl="~site/_layouts/15/viewlsts.aspx" id="idNavLinkSiteHierarchyV4" Text="<%$Resources:wss,treeview_header%>" accesskey="<%$Resources:wss,quiklnch_allcontent_AK%>"
CssClass="ms-tv-header" />
<SharePoint:DelegateControl runat="server" ControlId="TreeViewAndDataSource">
<Template_Controls>
<SharePoint:SPHierarchyDataSourceControl
runat="server"
id="TreeViewDataSourceV4"
RootContextObject="Web"
IncludeDiscussionFolders="true"
/>
<SharePoint:SPRememberScroll runat="server" id="TreeViewRememberScrollV4" onscroll="javascript:_spRecordScrollPositions(this);"
style="overflow: auto;">
<SharePoint:SPTreeView
id="WebTreeViewV4"
runat="server"
ShowLines="false"
DataSourceId="TreeViewDataSourceV4"
ExpandDepth="0"
SelectedNodeStyle-CssClass="ms-tv-selected"
NodeStyle-CssClass="ms-tv-item"
SkipLinkText=""
NodeIndent="12"
ExpandImageUrl="/_layouts/15/images/tvclosed.png?rev=47"
ExpandImageUrlRtl="/_layouts/15/images/tvclosedrtl.png?rev=47"
CollapseImageUrl="/_layouts/15/images/tvopen.png?rev=47"
CollapseImageUrlRtl="/_layouts/15/images/tvopenrtl.png?rev=47"
NoExpandImageUrl="/_layouts/15/images/tvblank.gif?rev=47"
>
</SharePoint:SPTreeView>
</SharePoint:SPRememberScroll>
</Template_Controls>
</SharePoint:DelegateControl>
</SharePoint:SPNavigationManager>
<asp:ContentPlaceHolder id="PlaceHolderQuickLaunchBottom" runat="server">
<div class="ms-core-listMenu-verticalBox">
<SharePoint:ClusteredSPLinkButton
runat="server"
id="idNavLinkViewAll"
PermissionsString="ViewFormPages"
NavigateUrl="~site/_layouts/15/viewlsts.aspx"
Text="<%$Resources:wss,AllSiteContentMore%>"
ToolTip="<%$Resources:wss,AllSiteContentMore%>"
accesskey="<%$Resources:wss,quiklnch_allcontent_AK%>"
CssClass="ms-core-listMenu-item ms-core-listMenu-heading" />
</div>
<SharePoint:FlightedContent runat="server" id="GroupsAndSitesLinking" ExpFeature="GroupsAndSitesLinking" RenderIfInFlight="true">
  <SharePoint:DelegateControl id="connectedGroupsNav" runat="server" ControlId="ConnectedGroupsNav" AllowMultipleControls="true" />
</SharePoint:FlightedContent>
</asp:ContentPlaceHolder>
</div>
<SharePoint:DelegateControl runat="server" ControlId="QuickLaunchBottom"/>
</asp:ContentPlaceHolder>
  </SharePoint:AjaxDelta>
</div>
<div id="contentBox"
 aria-live="polite" aria-relevant="all"  role="main">
  <a id="mainContent" name="mainContent" tabindex="-1"></a>
  <div id="notificationArea" class="ms-notif-box"></div>
<SharePoint:AjaxDelta id="DeltaPageStatusBar" BlockElement="true" runat="server">
<div id="pageStatusBar"></div>
</SharePoint:AjaxDelta>
<SharePoint:AjaxDelta id="DeltaPlaceHolderMain" BlockElement="true" IsMainContent="true" runat="server" >
<asp:ContentPlaceHolder id="PlaceHolderMain" runat="server" />
</SharePoint:AjaxDelta>
</div>
<SharePoint:AjaxDelta id="DeltaFormDigest" BlockElement="true" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderFormDigest" runat="server">
<SharePoint:FormDigest runat="server"/>
</asp:ContentPlaceHolder>
</SharePoint:AjaxDelta>
<asp:ContentPlaceHolder id="PlaceHolderSiteName" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderHorizontalNav" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderPageImage" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderTitleLeftBorder" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderMiniConsole" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderTitleRightMargin" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderTitleAreaSeparator" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderNavSpacer" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderLeftNavBarBorder" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderBodyLeftBorder" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderBodyRightMargin" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderTitleAreaClass" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderGlobalNavigation" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="PlaceHolderGlobalNavigationSiteMap" runat="server" Visible="false" />
<asp:ContentPlaceHolder id="WSSDesignConsole" runat="server" Visible="false" />
</div>
</div>
<%@ Register TagPrefix="wssuc" TagName="HelpPanel" src="~/_controltemplates/15/HelpPanel.ascx" %>
<SharePoint:AjaxDelta id="DeltaHelpPanel" runat="server">
  <div id = "helppanelCntdiv" class="ms-Help-PanelContainer">
<wssuc:HelpPanel runat="server" />
  </div>
</SharePoint:AjaxDelta>
<SharePoint:AjaxDelta id="DeltaPageInstrumentation" runat="server">
<SharePoint:FlightedContent runat="server" ExpFeature="UserActivityLogging" RenderIfInFlight="true">
<SharePoint:PageInstrumentationControl runat="server" Id="PageInstrumentationControl" />
</SharePoint:FlightedContent>
</SharePoint:AjaxDelta>
</div>
</SharePoint:SharePointForm>
<SharePoint:AjaxDelta id="DeltaPlaceHolderUtilityContent" runat="server">
<asp:ContentPlaceHolder id="PlaceHolderUtilityContent" runat="server"/>
</SharePoint:AjaxDelta>
<SharePoint:ScriptBlock runat="server">
var g_Workspace = "s4-workspace";
</SharePoint:ScriptBlock>
</body>
</SharePoint:SPHtmlTag>


at No comments:
Subscribe to: Posts (Atom)

SharePoint online - Get List-item attachments and Display to div

Step 1 : Create a List ex: TestList and attach few images Step 2 : Copy and Pastet the below coding in App.js var  Items =  null ; ...