jsSaturday - PhoneGap and jQuery Mobile for SharePoint 2013

  • 813 views
Uploaded on

 

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
813
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
0
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • Question for the public: Which design pattern do you see in the index.html and js files?
  • Explain: www folder, content type for new files Explain the interaction between HTML and JS file – creates custom events AFTER device ready Show debugging information – App.cs file Show Config.xml file – the app manifest, explain about plugins
  • Open the feeds in the browser: http://93.152.184.204:2013/_api/contextinfo http://93.152.184.204:2013/_api/web/lists/ http://93.152.184.204:2013/_api/web/lists/getbytitle('Birthdays')/items http://93.152.184.204:2013/_api/web/lists/getbytitle('Birthdays')/items(1)

Transcript

  • 1. PhoneGapAnd_jQueryMobileFor SharePointvar MobileWebInSharePoint = { Author: ‘Kiril Iliev’, Tags: [‘SharePointAPI’, ‘MobileWeb’]};
  • 2. Summary What is PhoneGap? PhoneGap.ProjectStructure Short DEMO and Tips SharePoint.Communication DEMO – CRUD with SharePoint 2013 REST Services
  • 3. What is PhoneGap?PhoneGap is a collection of tools, and librariesthat allow you to build native mobileapplications for multiple devices.* * PhoneGap Site
  • 4. What is PhoneGap? Re-usability
  • 5. PhoneGap.ProjectStrucutre The www folder App Init – index.js and index.html Enable debug information Loading plugins App information
  • 6. DEMOPhoneGap Project Structure
  • 7. SharePoint.Communication• Using ASMX Services and SOAP Messages• Using SVC services• Using the API – SharePoint 2013 _api
  • 8. SharePoint.Communication = { asmxService: true};object = { spSite: $("#spSite").val() + "_vti_bin/authentication.asmx", spSoap:  "<?xml version=1.0 encoding=utf-8; ?>" + "<soap:Envelope xmlns:xsi=http://www.w3.org/2001/XMLSchema- instance xmlns:xsd=http://www.w3.org/2001/XMLSchema xmlns:soap=http://schemas.xmlsoap.org/soap/envelope/ >" + "<soap:Body>" + "<Login xmlns=http://schemas.microsoft.com/sharepoint/soap/>" + "<username>" + window.localStorage.getItem("username") + "</username>" + "<password>" + window.localStorage.getItem("username") + "<password>" + "</Login>" + "</soap:Body>" + "</soap:Envelope>"} 
  • 9. SharePoint.Communication = { svcServices: true};$.getJSON($("#spSite").val() + "/_vti_bin/listdata.svc/Birthdays", function (data) {      $.each(data.d.results, function (i, item) {          var output = "<li><a href=# data-theme=b data-icon=gear >" + $(this).attr("ows_Title") + "</a></li>";          $("#spListView").append(output);      }); $("#spListView").listview("refresh");});
  • 10. SharePoint.Communication = { sp2013API: true};GetListItems: function (params, onSuccessFunc, onErrorFunc) {          var xhr = $.ajax({              headers: {                  "Authorization": spListViewModel.cryptBasicAuth(window.localStorage.getItem("username"),       window.localStorage.getItem("password")),                  "ACCEPT": "application/json;odata=verbose", //or application/atom+xml                      "X-RequestDigest": params.formDigest              },              url: params.spSite,              type: "POST",              dataType: "json",              contentType: "application/json;odata=verbose",              success: onSuccessFunc,              error: onErrorFunc         });}
  • 11. SharePoint.Communication = { sp2013API.Extend: true};• _api alias for _api_bin/client.svc• All new functionalities in _api are presented in the _api_bin/client.svc as well• Querying is similar to the Managed Client Object Model
  • 12. SharePoint.Communication = { sp2013API.ServiceEndPoints: […]};Area Access pointSite http://sitecollection/_api/siteWeb http://sitecollection/_api/web http://User Profile sitecollection/_api/SP.UserProfiles.Peo pleManagerSearch http://sitecollection/_api/searchPublishing http://sitecollection/_api/publishing
  • 13. DEMOService End Points
  • 14. SharePoint.Communication = { CRUD.Read: {…}};• GET request• Accept Header • application/json;odata=verbose //or application/atom+xml
  • 15. DEMOSharePoint.ReadData
  • 16. SharePoint.Communication = { CRUD.Create: {…}};• Sending the FormDigest Header • X-RequestDigest header inside the SharePoint context • X-RequestDigest header outside the SharePoint context• __metadata ‘type’ property required • List name dependent • Conflicts with different lists
  • 17. DEMOSharePoint.CreateData
  • 18. SharePoint.Communication = { CRUD.Delete: {…}};• If-Match header• RequestType: ‘DELETE’• ItemIdentification(ID)• …and do not forget the FormDigest, of course
  • 19. DEMOSharePoint.DeleteData
  • 20. SharePoint.Communication = { CRUD.Update: {…}};•If-Match header – etag identification•RequestType: ‘PUT’ or ‘MERGE’•Do I need to mention the FormDigest?
  • 21. DEMOSharePoint.UpdateData
  • 22. Thanks to our Sponsors:Diamond Sponsor:Platinum Sponsors:Gold Sponsors:Swag Sponsors:Media Partners:
  • 23. Expect very soon: SharePoint Saturday! Saturday, June 8, 2013 Same familiar format – 1 day filled with sessions focused on SharePoint technologies Best SharePoint professionals in the region Registrations will be open next week (15th)! www.SharePointSaturday.eu