LightUp SharePoint with Silverlight
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

LightUp SharePoint with Silverlight

on

  • 1,724 views

LightUp SharePoint with Silverlight by Tan Choon Ngee

LightUp SharePoint with Silverlight by Tan Choon Ngee

Statistics

Views

Total Views
1,724
Views on SlideShare
1,724
Embed Views
0

Actions

Likes
0
Downloads
14
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • There are at least three ways to add a Silverlight application to a Sharepoint web site. The first is indicated if you want to insert a third parties Silverlight application and you have just the .xap file and not the source code. The second method uses a developer-side approach and gives you the maximum control of what is happening and the third is useful if you want your Silverlight application to be deployed in a Sharepoint site automatically when you build or debug your application.The first method: using a shared Document LibraryLet me first show the more intuitive way but less appropriate in a production environment. Locate the Silverlight application you want to put in the Sharepoint site, something simple to start such as a banner rotator or a simple animation. Go to your new “Team Site” and sign in as administrator. Click on “Shared Documents” on the menu on the left of the web page.>>Next animationClick on “Add new document” link at the bottom of the list to show the Upload Document dialog box:>>Next AnimationClick on Browse… button and look for the “.xap” file in the folder of your Silverlight application. Click OK and you should see your .xap file included in the list of share documents. Now click on “Site Pages” on the left menu to go to the specialized List containing all the pages of your site. Create a new page by clicking on “Add new page”, insert a page name and the new page in editing mode with the content editor ribbon on the top will appear: >>Next AnimationNow you are ready to insert your Silverlight application. Click on “Editing Tools/Insert”, select “Media and Content” in Categories list view and “Silverlight Web Part” in “Web Parts” list view: >>Next AnimationA dialog box will ask you the URL for the .xap file you want to add to the page; here inexplicably Sharepoint does not offer you the possibility to navigate the Document libraries through the UI and you have to digit the path and name of your file directly in a text box. Fortunately the task is easy and you can insert a relative path, something like this:>>Next AnimationNow you should see your Silverlight application confined in a box entitled “Silverlight Web Part”. Don’t bother about the actual look & feel, you can resize the box and show/hide the title clicking on the arrow at the top right corner and select “Edit Web Part” on the small drop down menu:>>Next AnimationA new configuration will appear on the right side allowing you to refine appearance, layout and other settings:>>Next AnimationClick OK and save your page and your work is done.
  • Second method: using a web part This method requires the creation of a new “Sharepoint Web Part” directly from Visual Studio 2010. Fortunately there is a template project ready to use; so let’s open Visual Studio 2010 and create a new project selecting the “Sharepoint 2010 Visual Web Part” template: >> Next AnimationVisual Studio will ask you the server where you want to deploy your web part; select your Sharepoint solution and go ahead. On the Solution Explorer you will see the web part related files and a new user control: >> Next AnimationDelete the user control since we won’t use it. Open the “.cs” file of your web part (VisualWebPart1.cs in my case) and change the name of the class (VisualWebPart1 in my case) with something like SLVisualizer; locate the CreateChildren() method and substitute the content with the following code:>> Next AnimationThe idea here is to use a LiteralControl to add a portion of HTML code to the rendering of the web part. As you can see, in the parameter “source” I included the relative path of the xap file we already added in the Shared Document Library as described in the first method. Before going on, change the name of the class of your Web Part to something easy to identify, then open the file with “.webpart” extension and change the type name and title of your Visual Web Part in the elements.xml file giving the same name used for the class as follows:>> Next AnimationThis will help you to identify the web part when you add it to a page of your site. Now you are ready for the deployment. Select Build/Deploy Solution from the top menu of Visual Studio and once the operation has been completed, open your site in the browser, log in as administrator, create a new page and from the “Editing Tools” ribbon on the top of the page select “Insert/Web Part” and, from “Categories” choose “Custom” and from the Web Part list, choose the Visual Web Part you just deployed:Click “Add”, then save the page and enjoy your new Silverlight app inside the Sharepoint page.
  • Third method: using a Sharepoint moduleThis method is probably the most recommended if you have the source code of the Silverlight application and want to delegate to Visual studio the task to keep your Silverlight application updated in a site of Sharepoint. Open your Silverlight Solution in Visual Studio 2010 and add a new project selecting the “Sharepoint 2010/Empty SharepointProject” template:>> Next AnimationChoose the “Deploy as a sandboxed Solution” option and click “Finish”. Then right mouse click on the new project in the Solution explorer Window to add a new item. Select “Sharepoint 2010/Module” from the installed templates:>> Next AnimationGo back to the “Solution Explorer”, expand the tree under the new module and delete the file “Sample.txt. Then right mouse click on the Module to open the Properties:>> Next AnimationSelect the “Project Output References” property and click on the small button on the right to open the “Project Output References” Dialog Box; here click on the “Add” button to add an item to the list on the left; configure the properties on the right as shown in the following image:>> Next AnimationIn the “Project Name” property you have to choose the name of your Silverlight app project (in my case it is DataFilesViewer).Click “OK” and you are almost done. The concept behind this is that this “Module” will act as a 'ferry' to the insertion of the Silverlight in SharePoint Site. You can now select the Sharepoint project just included in the Solution as the “Startup project”, add the Silverlight Project to its “Project Dependencies” and deploy your solution. Your “.xap” file will be added to the Sharepoint site under the path:>> Next AnimationLet’s go ahead and open the dialog box of the properties of your Sharepoint Module project; click on the “SharePoint” tab option and set the “Enable Silverlight debugging (instead of Script debugging) checkbox”.Now, if you press “F5” you will be able to debug your Silverlight application inside the Sharepoint site. Obviously you have first to add the Silverlight app to a page to do so. With the page in edit mode, click on “Editing Tools/Insert”, select “Media and Content” in Categories list view and “Silverlight Web Part” in “Web Parts” list view; then put the path above listed when requested and save the page.

LightUp SharePoint with Silverlight Presentation Transcript

  • 1. Light Up SharePoint …… with Silverlight!
    Light Up SharePoint
    Choon Ngee, Tan
    Regional Director
    aZaaS PteLtd
    choon@azaas.com
  • 2. 2
    Microsoft Gold Certified Partner with Web Development and Software Development Competencies
    Microsoft Silverlight Expert Partner
    Windows Azure Inner Circle Partner
    Technical Director is in Microsoft Regional Director Program and only about 170 world wide.
    Nominated for Microsoft ISV for the Year 2010.
  • 3. 3
    Beijing
    Headquartered in Singapore.
    Subsidiaries in the China, Hong Kong, Taiwan
    Over 300 customers regionally
    Over 150 Sharepoint customers
    Shanghai
    Taipei
    Guangzhou
    Shenzhen
    Hong Kong
    Singapore
  • 4. Topics
    Why Use Silverlight With SharePoint?
    DEMO: Silverlight Dashboard
    The New Kid: SharePoint Online
    Deploying Silverlight Applications to SharePoint
    4
  • 5. SharePoint …
    5
  • 6. … is a greatplatform!
    Sharepointis very successful and a great platform
    From the largest Fortune 500 companies to small and medium businesses – all save time and money with Sharepoint.
    SP offers great features and functionality out of the box.
    6
  • 7. But WhatAboutThe User Experience?
    The SharePoint UX can be challenging ...... because it is based on a web user experience metaphor.
    A web user experience is not as smooth and rich as a native desktop application environment.
    Even though SharePoint is very well integrated with the desktop and Office applications, the UX is still a tradeoff between the broad reach of a web application and the richness and UX feature set of a desktop client.
    7
  • 8. 8
    Broad Reach
    “Lowestcommondenominator“
    Better UX
    Tradeoff betweenreachandrich
    Best UX
    Rich clientexperience
  • 9. Isthis a Problem?
    SharePoint users are generally OK with this tradeoff ...... but there is certainly room for improvement!
    Silverlight can enrich the SharePoint experience ...... and excite and delight your SharePoint users!
    The need for rich, elegant and interactiveSharePoint line of business applications is already high.
    And this need will grow in the future!
    9
  • 10. 10
    DemoSilverlight business dashboard
  • 11. Silverlight Pivot Viewer
    11
  • 12. SingHealth
    12
  • 13. Multi-Touch Silverlight Application
    13
    “We are privileged to have aZaaS as our partner in developing our www.flu-card.com portal”
    Mr Foo KW, Vice President, HDD Solutions, Trek 2000 International Ltd
  • 14. Silverlight in Sharepoint
    14
  • 15. The New Kid: SharePoint Online
    SharePoint in the Cloud – hosted by Microsoft
    Low-cost, from $5,25 per user/month
    Today: MOSS 2007 (without admin access)
    Portals, Team Sites, Collaboration Workspaces
    SharePoint Web Services
    Customization with SharePoint Designer
    Office 365 (Beta): SharePoint 2010 (without admin access)
    Sandboxed solutions
    VS 2010 Developer tooling
    Data access through client object model, REST, WCF
    15
  • 16. On-Premise vs. Online
    On Premise
    SharePoint Online - Standard
    SharePoint Online - Dedicated
    Hosted in MSFT data center
    Dedicated Hardware
    Admin outsourced to MSFT
    Partial and full trust customization*
    Authenticated via NTLM
    Designed for 5000+ seats
    Self-hosted in your data center
    Dedicated hardware
    Central admin access
    Partial and full trust customization
    Authenticated via AD
    Available to companies of any size
    Hosted in MSFT data center
    Multi-tenant/shared hardware
    Admin outsourced to MSFT
    Partial trust customization
    Authenticated via certs and forms
    Available for companies of any size
  • 17. Deploying Silverlight to SharePoint
    Need to install the XAP file somewhere
    Document library? LAYOUTS folder? Hive?
    Need to display the XAP somehow
    Insert the Silverlight HTML into the page
    Can do this with the Content Editor web part
    Can also write a custom SharePoint web part
    Much easier in SharePoint 2010!
    Built-in Silverlight web part can host XAP
    New client object model allows access outside of SharePoint
    Silverlight can be automatically deployed as part of a .wsp
    17
  • 18. Deploying Silverlight to SharepointFirst method: Using a shared Document Library
    18
  • 19. Deploying Silverlight to SharepointSecond method: Using a Web Part
    19
  • 20. Deploying Silverlight to SharepointThird method: Using a Sharepoint Module
    20
  • 21. Accessing SharePoint data
    Simple RSS access to lists
    REST and WCF access to lists (new in 2010)
    Call SharePoint web services API (lists.asmx)
    Pass data from hosting HTML page to anembedded SL application with initParams
    Call a custom (external) web service
    Download resources directly
    21
  • 22. Sharepoint Online Integration
    22
    Sharepoint Online / On-Premise
  • 23. SharePoint 2010 and Silverlight
    Much improveddeveloperfeatures!
    Silverlight Web Part built in.
    Sharepoint Client Object Model for Silverlight:
    Microsoft.Sharepoint.Client.Silverlight
    Microsoft.Sharepoint.Client.Silverlight.Runtime
    Can accessinformation in a SharePoint instancefromanywhere outside of SharePoint!
    23
  • 24. SharePoint 2010 and Silverlight
    24
    public void LoadSPDocs(string countryId)
    {
    ClientContextctx = newClientContext(ApplicationContext.Current.Url);
    List lib = ctx.Web.Lists.GetByTitle("Product Documents");
    CamlQuerycq = new CamlQuery();
    cq.ViewXml = String.Format(@"<View><Query><Where><Contains><FieldRefName='FileLeafRef'/>
    <Value Type='Text'>{0}</Value></Contains></Where></Query></View>",countryId);
    items = lib.GetItems(cq);
    ctx.Load(lib);
    ctx.Load(items);
    ctx.ExecuteQueryAsync(OnSuccess, OnFailure);
    }
    private void OnSuccess(object sender, ClientRequestSucceededEventArgs e)
    {
    Dispatcher.BeginInvoke(BindListBox);
    }
    private void OnFailure(object sender, ClientRequestFailedEventArgs e) { }
  • 25. Summary
    Silverlight and SharePoint are “made for each other” and work together very well.
    Use Silverlight in a web part to enrich the stock SharePoint experience to excite and delight your users.
    Use Silverlight to pull together multiple data sources and SharePoint data to create mashups.
    SharePoint 2010 comes with many additional features for developers building Silverlight applications.
    25
  • 26. Resources
    Red Silverlight Dashboard:http://silverlightdashboard.dev.mandogroup.com/
    Demo source code:http://koestiestorage.blob.core.windows.net/downloads/DemoDashboardFINAL.zip
    Tutorial Sharepoint/SL integration:http://koestiestorage.blob.core.windows.net/downloads/SPSSLTutorial.zip
    BPOS – 30 Day Sharepoint Online trial:http://www.microsoft.com/online/trial-bpos.mspx
    Office 365 Beta:http://office365.microsoft.com/en-US/sharepoint-online.aspx
    26
  • 27. Choon Ngee, Tan
    Regional Director
    aZaaS Pte Ltd
    choon@azaas.com
    © 2009 Microsoft Corporation. All rights reserved. Microsoft, Visual Studio, the Visual Studio logo, and [list other trademarks referenced] are trademarks of the Microsoft group of companies.
     
    The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation.  Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation.  MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED, OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.