locked
Silverlight and Sharepoint RRS feed

  • Question

  • Hi !

    i have started working with silverlight a week ago. Now i need to integrate to  MOSS 2007 . I am not able to integrate the silverlight pages or the controls into the moss environment.

    I am looking for help from any one. If you could send me the sample and the steps to integrate with MOSS it will be great help

     arulvivek@gmail.com

    Thanks

    Arul 

      

     

    • Moved by mbanavige Friday, June 22, 2007 6:01 PM Migration data
    Friday, June 22, 2007 9:37 AM

Answers

  • Hi

    I had spend several hours to integrate the Silverlight page into MOSS.Now i have integrate the silverlight pages into MOSS . I have followed the following steps

    AIM :  Want to Integrate the Silverlight Page on the Masterpage ( Silverlight menu with small animation in the top of the page )

    Steps :

    1. create a simple animation menu controls using   microsoft SDK

    2. Create a Custom Master Page in MOSS

    3. Add a Panel ( div ) element into the master page

    4 copy the source code change according to your environment   

    <div id="SilverLightTopPanel"><script type="text/javascript">

    Sys.Silverlight.createObjectEx({

    source: "MasterPageTop.xaml",   // Proper Path  Ex. This file is uploaded into pages directory

    parentElement: document.getElementById("SilverLightTopPanel"),

    id: "SilverlightControl",

    properties: {

    width: "1024",

    height: "60",

    version: "0.95",

    enableHtmlAccess: true

    },

    events: {}

    }); </script></div>

    5. Publish the master page and approve the same.

    6. Change your defalut.aspx file  masterpage url  to custom.master  ( <%@ Page language="C#" MasterPageFile="~masterurl/custom.master" ...... )

    7 Upload the xaml file into document library  Initally i  had upload into pages directory ( But you can create a seprate folder and you can refer the path the masterpage )

    8. Create ClientBin Direcotry in MOSS - under virtualdirectory   for example C:\Inetpub\wwwroot\wss\VirtualDirectories\CgoSite

    9. Open IIS and locate the clientBin directory, and  select property window of the Clientbin

    10. Change the execute permission to     <     Script Only    >

    11. Copy the dll generated by orcas for silverlight project  into  ClientBin Directory  ( MOSS )

     Thanks

    Arul Vivekananth

    Technical Consultant

    CONCHANGO

    arulvivek@gmail.com

    Tuesday, July 10, 2007 6:13 AM
  • Hi , In my previous post i have missed some steps to integrate the silverlight pages into MOSS. Now it is updated please follow this step

    Here is the solution for silverlight MOSS integration. 
    1. Part 1 (Silverlight project DLL to be copied into this ClientBin Directory)
      1. Create ClientBin Directory under this folder   (C:\Inetpub\wwwroot\wss\VirtualDirectories\80)    Default web app
      2. Open IIS Manager  and locate the ClientBin Directory Created in step 1
      3. Choose the property window of CilentBin4.      Change the  Execute Permissions: to Scripts Only
    2. Part 2
      1.  Create a Project in Expression Blend
      2. Build and Test the project.
      3. Copy the DLL ( created under ClientBin directory of the Silverlight project) into the Sharepoint application  ClientBin Directory (C:\Inetpub\wwwroot\wss\VirtualDirectories\80)
    3. Part 3
      1.  Upload the  XAML file to sharepoint application
        1. SiteAction ->View All Site content                                                                                                 
          1.    Option 1
            1.  Create -> Documentment Library
            2.  Type SilverlightPages ( anyname ) into Name Textbox and click create button
            3.  Upload the XAML file into the Silverlightpages folder                                                                                                
          2.  Option 2
            1. Click on pages
            2.  Upload the XAML file into the Pages folder
        2. Publish and Approve the file  ( if needed )
      2. Add the following code into your sharepoint page  or  custom master page
      • Option 1
    <div  id="SilverLightTopPanel">  // you can specify id
     <script type="text/javascript">        
     Sys.Silverlight.createObjectEx({         source: "MasterPageTop.xaml", // Specify your xaml file          parentElement: document.getElementById("SilverLightTopPanel"),  // specify your Div element ID         id: "SilverlightControl",         properties: {               width: "1024",               height: "60",               version: "0.95",               enableHtmlAccess: true         },         events: {}   });        
    </script>
    </div>
      • Option 2      
    <div  id="SilverLightTopPanel">  // you can specify id         
    <script type="text/javascript">                  createsilverlightmenu()         </script>     
    </div>          
     You can create function as a seprate (JS) file and upload into proper location             For example  createsilverlghtobjects.js                         
      • function createsilverlightmenu()
    { Sys.Silverlight.createObjectEx({            source: "MasterPageTop.xaml", // Specify your xaml file             parentElement: document.getElementById("SilverLightTopPanel"),  // specify your Div element ID            id: "SilverlightControl",            properties: {                  width: "1024",                  height: "60",                  version: "0.95",                  enableHtmlAccess: true            },            events: {}               });}                
        •  Copy this (createsilverlghtobjects .js) file into C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033 (Sharepoint sever) 
    3.      You have to copy the silverlight.js file (from Microsoft ) into C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033 (Sharepoint sever) 

    4.      You have to specify the file location into your master page

    ( Add the blow code into your custom master page ( inside head tag)

    • <SharePoint:ScriptLink ID="ScriptLink2" language="javascript" name="silverlight.js"  runat="server"/>
    • <SharePoint:ScriptLink ID="ScriptLink3" language="javascript" name=" createsilverlghtobjects.js"  runat="server"/> ( for Option 2 ) 

    Thanks

     

    Arul vivekananth

    conchango ( India)

    arulvivek@gmail.com

    Wednesday, July 11, 2007 3:12 AM

All replies

  • try contacting Angus Logan. He did a presentation today at Remix in Melbourne on integrating silverlight and MOSS.Pretty cool presentation Here is his blog site
    http://blogs.msdn.com/angus_logan/

    He is a very helpful guy.

     

     

     

    Monday, June 25, 2007 8:02 AM
  • Actually, the simple web page web part works amazingly well. Just point it to the url of a silverlight enabled web site, and voila, you have silverlight content running in your portal.

    However, to integrate tightly into the MOSS environment, build silverlight specific web-parts, etc., is a little (or a lot) more work, depending on how much additional integration you want to the MOSS infrastructure; things like BDC, etc., could be really interesting.

     

    Kevgor

    Monday, June 25, 2007 4:23 PM
  • Hi

    I had spend several hours to integrate the Silverlight page into MOSS.Now i have integrate the silverlight pages into MOSS . I have followed the following steps

    AIM :  Want to Integrate the Silverlight Page on the Masterpage ( Silverlight menu with small animation in the top of the page )

    Steps :

    1. create a simple animation menu controls using   microsoft SDK

    2. Create a Custom Master Page in MOSS

    3. Add a Panel ( div ) element into the master page

    4 copy the source code change according to your environment   

    <div id="SilverLightTopPanel"><script type="text/javascript">

    Sys.Silverlight.createObjectEx({

    source: "MasterPageTop.xaml",   // Proper Path  Ex. This file is uploaded into pages directory

    parentElement: document.getElementById("SilverLightTopPanel"),

    id: "SilverlightControl",

    properties: {

    width: "1024",

    height: "60",

    version: "0.95",

    enableHtmlAccess: true

    },

    events: {}

    }); </script></div>

    5. Publish the master page and approve the same.

    6. Change your defalut.aspx file  masterpage url  to custom.master  ( <%@ Page language="C#" MasterPageFile="~masterurl/custom.master" ...... )

    7 Upload the xaml file into document library  Initally i  had upload into pages directory ( But you can create a seprate folder and you can refer the path the masterpage )

    8. Create ClientBin Direcotry in MOSS - under virtualdirectory   for example C:\Inetpub\wwwroot\wss\VirtualDirectories\CgoSite

    9. Open IIS and locate the clientBin directory, and  select property window of the Clientbin

    10. Change the execute permission to     <     Script Only    >

    11. Copy the dll generated by orcas for silverlight project  into  ClientBin Directory  ( MOSS )

     Thanks

    Arul Vivekananth

    Technical Consultant

    CONCHANGO

    arulvivek@gmail.com

    Tuesday, July 10, 2007 6:13 AM
  • Nice work, I'm going to give that a try.

    Tuesday, July 10, 2007 4:46 PM
  • Hi , In my previous post i have missed some steps to integrate the silverlight pages into MOSS. Now it is updated please follow this step

    Here is the solution for silverlight MOSS integration. 
    1. Part 1 (Silverlight project DLL to be copied into this ClientBin Directory)
      1. Create ClientBin Directory under this folder   (C:\Inetpub\wwwroot\wss\VirtualDirectories\80)    Default web app
      2. Open IIS Manager  and locate the ClientBin Directory Created in step 1
      3. Choose the property window of CilentBin4.      Change the  Execute Permissions: to Scripts Only
    2. Part 2
      1.  Create a Project in Expression Blend
      2. Build and Test the project.
      3. Copy the DLL ( created under ClientBin directory of the Silverlight project) into the Sharepoint application  ClientBin Directory (C:\Inetpub\wwwroot\wss\VirtualDirectories\80)
    3. Part 3
      1.  Upload the  XAML file to sharepoint application
        1. SiteAction ->View All Site content                                                                                                 
          1.    Option 1
            1.  Create -> Documentment Library
            2.  Type SilverlightPages ( anyname ) into Name Textbox and click create button
            3.  Upload the XAML file into the Silverlightpages folder                                                                                                
          2.  Option 2
            1. Click on pages
            2.  Upload the XAML file into the Pages folder
        2. Publish and Approve the file  ( if needed )
      2. Add the following code into your sharepoint page  or  custom master page
      • Option 1
    <div  id="SilverLightTopPanel">  // you can specify id
     <script type="text/javascript">        
     Sys.Silverlight.createObjectEx({         source: "MasterPageTop.xaml", // Specify your xaml file          parentElement: document.getElementById("SilverLightTopPanel"),  // specify your Div element ID         id: "SilverlightControl",         properties: {               width: "1024",               height: "60",               version: "0.95",               enableHtmlAccess: true         },         events: {}   });        
    </script>
    </div>
      • Option 2      
    <div  id="SilverLightTopPanel">  // you can specify id         
    <script type="text/javascript">                  createsilverlightmenu()         </script>     
    </div>          
     You can create function as a seprate (JS) file and upload into proper location             For example  createsilverlghtobjects.js                         
      • function createsilverlightmenu()
    { Sys.Silverlight.createObjectEx({            source: "MasterPageTop.xaml", // Specify your xaml file             parentElement: document.getElementById("SilverLightTopPanel"),  // specify your Div element ID            id: "SilverlightControl",            properties: {                  width: "1024",                  height: "60",                  version: "0.95",                  enableHtmlAccess: true            },            events: {}               });}                
        •  Copy this (createsilverlghtobjects .js) file into C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033 (Sharepoint sever) 
    3.      You have to copy the silverlight.js file (from Microsoft ) into C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033 (Sharepoint sever) 

    4.      You have to specify the file location into your master page

    ( Add the blow code into your custom master page ( inside head tag)

    • <SharePoint:ScriptLink ID="ScriptLink2" language="javascript" name="silverlight.js"  runat="server"/>
    • <SharePoint:ScriptLink ID="ScriptLink3" language="javascript" name=" createsilverlghtobjects.js"  runat="server"/> ( for Option 2 ) 

    Thanks

     

    Arul vivekananth

    conchango ( India)

    arulvivek@gmail.com

    Wednesday, July 11, 2007 3:12 AM
  • I've tried both options but still the silverlight does not show up. I've developed just a simple title bar I want displayed at the top and have modified the master page. There is no error. It's just a blank space. I found that I did not have a ClientBin as mentioned before within the silverlight project. Once I opened it within VS, a bin folder was created and I was able to take that dll, but it was not created when I created the project within Expression Blend. I also had 3 js files in the directory (silverlight.js, default_html.js, and Page.xaml.js) Any other ideas? 

    Monday, August 20, 2007 5:53 PM
  • Hi

    Have you copied the All Js file in the proper location as i mentioned in my post. If you could not find add all js files are a embedded resource of the project and copy the dll into clientbin directory

    Thanks

     

     

     

    Tuesday, August 21, 2007 12:53 AM
  • I have copied the 3 js files into the c:\\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033. I then added a scriptlink for each of the js files

    <SharePoint:ScriptLink id="ScriptLink1" Language="javascript" Name="silverlight.js" runat="server"/>
    <SharePoint:ScriptLink id="ScriptLink2" Language="javascript" Name="createsilverlight.js" runat="server"/>
    <SharePoint:ScriptLink id="ScriptLink3" Language="javascript" Name="Page.xaml.js" runat="server"/>

     I added the div tag

    <div id="SilverlightControlHost" class="silverlightHost">
          <script type="text/javascript">
              createsilverlight()
          </script>
    </div>

    There was one dll in the bin directory of the project. I copied that file IS_Homepage_Header.dll to the ClientBin directory that I created. Does it make a difference that the dll wasn't in a bin directory and was only created when I opened the project within Visual Studio? It also wasn't named Client Bin but was under bin\debug\? Do I also need the pdb file?

    Tuesday, August 21, 2007 11:33 AM
  • could you please send me the project to me i will check the what is the issue, and i will let you know

     

    arulvivek@gmail.com

     

    Tuesday, August 21, 2007 12:37 PM
  • This works great, anyone figured out loading custom controls which hang out in a seperate dll?
    My app is made up of;
    mySilverlight.dll (main)
    mySilverlightCustomControl.dll

    I put them both in \Clientbin. The main dll is found but the custom control cannot be found.

    I loaded up fiddler to see where silverlight was going to pick up mySilverlightCustomControl.dll It was going to \Clientbin\mySilverlightCustomControl.dll

    Heres the weird bit. When I have fiddler running everything works fine! As soon as I close fiddler the dll (mySilverlightCustomControl.dll) cannot be found again.

    So fiddler is having a very beneficial side effect. but I cant ship fiddler :(

    Wednesday, December 12, 2007 7:11 AM
  • Hi,

    You can see a demo that renders a SharePoint Picture Library as Silverlight using the Data View web part

    http://www.wssdemo.com/pages/silverlight.aspx

    I have just updated it with a how to and credit/download for the XAML.

    Wednesday, January 16, 2008 4:15 AM
  • nice demo.. Thanks for sharing..  

    Wednesday, January 16, 2008 4:25 AM
  • I’ve just released a Silverlight Web Part that shows SharePoint documents and pictures in a fancy silverlight interface.




     
     

    You can download it at: http://www.triplewood.com/silverlight

    Give it a whirl. 

    Ian Campbell
    http://iancampbell.blogspot.com/

    Wednesday, January 16, 2008 4:47 AM
  • If you are new to integration of sharepoint and silverlight 1.0 and you want to give a  try here is the link to my blog check this i dont disappoint you.

    http://paritala-sasi.blogspot.com/ 

    cheers,

    sasi kanth paritala. 

     

    Sunday, March 30, 2008 8:41 AM
  • Also really worth checking out: Patrick Tisseghem's Silverlight Blueprint for Sharepoint

    http://www.u2u.be/res/tools/silverlightblueprint.aspx

    http://www.ssblueprints.net/sharepoint/

     

    Monday, March 31, 2008 3:32 PM
  • cool stuff.. i noticed the client requires 1.1 alpha refresh. Any chance this will be updated to work with 2B2?

    Monday, June 9, 2008 3:30 AM
  • hi great blog. but tried to implement it but i am getting an error

    errorcode:4005

    xamlfile:resource\triplewood.silverlight\page.xaml

    line:5

    i also changed the execution permission in iis as script only

    i am using silverlight 2.0 in my client machine.

    what changes should i do to view this webpart

    Thursday, February 5, 2009 8:09 AM
  • The .NET Framework 3.5 webcasts, podcasts, and virtual labs site has a demo of building a Microsoft Silverlight application that is integrated into Microsoft SharePoint Products and Technologies. Search for the "BenkoTIPS Live and On Demand: LINQ to Amazon to Silverlight to SharePoint Products and Technologies" webcast.

    Tuesday, March 3, 2009 3:37 PM
  • Integrating Silverlight 2.0 with MOSS2007

    http://smallworkarounds.blogspot.com/2009/07/integrating-silverlight-20-with.html


    This post tells how to integrate silverlight 2.0 with sharepoint or MOSS2007

    Monday, July 20, 2009 7:09 PM
  • hi this is an extra information about silverlight and MOSS some time u will need to render some info in run time in the silverlight control for example if u made connected web parts and u want to send some info from the provider web part to consumer web part which attach the silverlight control with the same way that i saw in the reply any way if wanna made this case the solution will be scriptable method that u call call method in silverlight control from JavaScript very easy and High performance if u have any questions am here :) thnx Mohamed Massoud
    Tuesday, August 11, 2009 4:21 PM
  • I uploaded a new version of my Silverlight WebPart, it now works with Silverlight 3.0 The WebPart will let you browse through a document or picture library in SharePoint and display the items in a cool i-tunes style coverflow control.

    For more details and download see http://www.triplewood.com/silverlight

    Ian
    Monday, September 7, 2009 10:22 AM
  • Hi Anyone can plz send the sample project of Silverlight intergration with sharepoint urgent.

     

    Sunday, December 13, 2009 11:57 PM
  • Hey Pavanpani,

    Could you give more details on what kind of integration you are after?

    You want to have a web part that shows list info? you want to have bing maps silverlight added on your page? you just want to have the option to have silverlight content on your sharepoint?

     

    Monday, December 14, 2009 4:28 AM