http://SilverlightDesktop.net

Intermediate Level - Creating a "Silverlight Notepad" module

(It is recommended that those new to SilverlightDesktop module development begin with the "Hello World!" tutorial.)

To use this tutorial you need to have Visual Studio 2008 installed and Silverlight Tools for Visual Studio 2008

This tutorial will cover creating a SilverlightDesktop module that allows users to save notes. The module uses web services to store and display the notes. Each user will have their own notes.

Step #1: Install the "Install version" of SilverlightDesktop.

You can find help on installing SilverlightDesktop here:

Step #2: Open the SilverlightDesktop site and build it

Open Visual Studio and then open the SilverlightDesktop website by selecting File then Open Web Site...

The site will open.

From the toolbar, select Build then Build Web Site.

The site should build without errors.

Step #3: Create the SilverlightNotepad Web Service

Use the following script to create a table in the SilverlightDesktop database:

CREATE TABLE [dbo].[SilverlightNotepad](
[NoteID] [int] IDENTITY(1,1) NOT NULL,
[UserName] [nvarchar](50) NOT NULL,
[IPAddress] [nvarchar](50) NOT NULL,
[Note] [nvarchar](100) NULL,
CONSTRAINT [PK_SilverlightNotepad] PRIMARY KEY CLUSTERED
(
[NoteID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON,
ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]

Step #4: Create the Linq to SQL class

Right-click on the App_Code folder in the SilverlightDesktop website and select Add New Item...

In the Add New Item box, select LINQ to SQL Classes under Templates. Enter SilverlightNotepad.dbml for Name. Select Visual C# for the Language. Click the Add button.

Switch to the Server Explorer and right-click on Data Connections and select Add Connection... to create a new connection. Create a connection to the SilverlightDesktop database.

Expand tables section and locate the SilverlightNotepad table created in the earlier step. 

Drag and drop the table on the design surface of the SilverlightNotepad Linq class.

Ensure that the database connection that the Linq to SQL class is using is SiteSqlServer. You do this by clicking on a clear space on the design service surface of the Linq to SQL class (so you can see it's properties) and selecting the proper connection from the Connection drop-down.

Save and close the SilverlightNotepad.dbml file.

Right-click on the root of the website and select Add New Item...

In the Add New Item box:

When the files are created they will be placed in the positions indicated above.

Move the files so that they reside in the positions indicated above.

Double-click on SilverlightNotepadWebService.cs to open it up in the editor.

Replace ALL the code with the following code:

Note, you will find it easier to copy and paste from the file at this link: SilverlightNotepadWebService.txt

// SilverlightDesktop - http://www.SilverlightDesktop.net
// Copyright (c) 2008
// by SilverlightDesktop
//
// Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated 
// documentation files (the "Software"), to deal in the Software without restriction, including without limitation 
// the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and 
// to permit persons to whom the Software is furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in all copies or substantial portions 
// of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED 
// TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL 
// THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF
// CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER 
// DEALINGS IN THE SOFTWARE.
 
using System;
using System.Collections;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Xml.Linq;
using System.Web.Script.Services;
 
[WebService(Namespace = "http://SilverlightDesktop.net/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService()]
public class SilverlightNotepadWebService : System.Web.Services.WebService
{
    #region GetNotepadContents
    [WebMethod(Description = "GetNotepadContents")]
    [ScriptMethod()]
    public String GetNotepadContents(int PortalID, int ModuleId, int UserID, string Password)
    {
        string NotepadContents = "";
        string strIPAddress = this.Context.Request.UserHostAddress;
        SilverlightDesktopAuthendicationHeader SilverlightDesktopAuthendicationHeader =
            new SilverlightDesktopAuthendicationHeader();
        SilverlightDesktopAuthendicationHeader.PortalID = PortalID;
        SilverlightDesktopAuthendicationHeader.UserID = UserID;
        SilverlightDesktopAuthendicationHeader.Password = Password;
        SilverlightDesktopAuthendicationHeader.ModuleId = ModuleId;
        SilverlightDesktopAuthendicationHeader.IPAddress = strIPAddress;
 
        Authendication Authendication = new Authendication(SilverlightDesktopAuthendicationHeader);
 
        SilverlightNotepadDataContext SilverlightNotepadDataContext = new SilverlightNotepadDataContext();
 
        if (Authendication.IsUserValid("Silverlight Notepad"))
        {
            UserInfo objUser = Authendication.GetUserInfo();
 
            var objSilverlightNotepad = (from SilverlightNote in SilverlightNotepadDataContext.SilverlightNotepads
                                         where SilverlightNote.UserName == objUser.Username
                                         select SilverlightNote).FirstOrDefault();
            if (!(objSilverlightNotepad == null)){
            NotepadContents = objSilverlightNotepad.Note;}
        }
        else
        {
            NotepadContents = "Must be logged in";
        }
 
        return NotepadContents;
    }
    #endregion
 
    #region SaveNotepadContents
    [WebMethod(Description = "SaveNotepadContents")]
    [ScriptMethod()]
    public void SaveNotepadContents(int PortalID, int ModuleId, int UserID, string Password, string NotepadContents)
    {
        string strIPAddress = this.Context.Request.UserHostAddress;
        SilverlightDesktopAuthendicationHeader SilverlightDesktopAuthendicationHeader =
            new SilverlightDesktopAuthendicationHeader();
        SilverlightDesktopAuthendicationHeader.PortalID = PortalID;
        SilverlightDesktopAuthendicationHeader.UserID = UserID;
        SilverlightDesktopAuthendicationHeader.Password = Password;
        SilverlightDesktopAuthendicationHeader.ModuleId = ModuleId;
        SilverlightDesktopAuthendicationHeader.IPAddress = strIPAddress;
 
        Authendication Authendication = new Authendication(SilverlightDesktopAuthendicationHeader);
 
        SilverlightNotepadDataContext SilverlightNotepadDataContext = new SilverlightNotepadDataContext();
 
        if (Authendication.IsUserValid("Silverlight Notepad"))
        {
            UserInfo objUser = Authendication.GetUserInfo();
 
            var objSilverlightNotepad = (from SilverlightNote in SilverlightNotepadDataContext.SilverlightNotepads
                                         where SilverlightNote.UserName == objUser.Username
                                         select SilverlightNote).FirstOrDefault();
 
            if (!(objSilverlightNotepad == null))
            {
                SilverlightNotepadDataContext.SilverlightNotepads.DeleteOnSubmit(objSilverlightNotepad);
                SilverlightNotepadDataContext.SubmitChanges();
            }
 
            SilverlightNotepad SilverlightNotepad = new SilverlightNotepad();
            SilverlightNotepad.UserName = objUser.Username;
            SilverlightNotepad.IPAddress = strIPAddress;
            SilverlightNotepad.Note = TrimLarge(NotepadContents);
 
            SilverlightNotepadDataContext.SilverlightNotepads.InsertOnSubmit(SilverlightNotepad);
            SilverlightNotepadDataContext.SubmitChanges();
        }
    }
    #endregion
 
    #region TrimLarge
    private string TrimLarge(string strText)
    {
        string strNewText;
 
        if (strText.Length > 99)
        {
            strNewText = strText.Substring(0, 99);
        }
        else
        {
            strNewText = strText;
        }
        return strNewText;
    }
    #endregion
}

Step #5: Create the SilverlightNotepad Project

From the toolbar, select File then New Project.

In the New Project box:

On the Add Silverlight Application box:

The project will be created.

Step #6 Create the Silverlight module

Right-click on the SilverlightNotepad project and select Add Service Reference

Enter the web address to the SilverlightNotepadWebService.asmx web service that your created and click the GO button.

When the web service is found, enter SilverlightNotepadWebService in the Namespace box and click the OK button.

The web service reference will be created.

Open the Page.xaml file and replace ALL the contents with the following:

Note, you may find it easier to copy from this page: SilverlightNotepad_xaml.txt

<UserControl x:Class="SilverlightNotepad.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="Auto" Height="Auto">
    <UserControl.Resources>
        <Storyboard x:Name="SaveAnimation">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="textBlock" 
	Storyboard.TargetProperty="(UIElement.Opacity)">
                <SplineDoubleKeyFrame KeyTime="00:00:00" Value="0.01"/>
                <SplineDoubleKeyFrame KeyTime="00:00:01" Value="0.92"/>
                <SplineDoubleKeyFrame KeyTime="00:00:02" Value="1"/>
                <SplineDoubleKeyFrame KeyTime="00:00:03" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </UserControl.Resources>
    <Canvas x:Name="LayoutRoot" Background="White">
        <Button Height="30" Width="87" Canvas.Left="1" Canvas.Top="2" Content="Save" x:Name="btnSave"/>
        <TextBox Height="160" Width="160" Canvas.Top="35" TextWrapping="Wrap" x:Name="txtContents"/>
        <TextBlock Height="23" Width="81" Canvas.Left="128.996" Canvas.Top="3.037" Text="Saved" TextWrapping="Wrap" 
	Foreground="#FF630404" HorizontalAlignment="Center" Opacity="0" x:Name="textBlock"/>
    </Canvas>
</UserControl>

Open the Page.xaml.cs file and replace ALL the contents with the following:Note, you may find it easier to copy from this page: SilverlightNotepad_Page_xaml_cs.txt

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.ServiceModel;
using System.ServiceModel.Channels;
 
using SilverlightNotepad.SilverlightNotepadWebService;
 
namespace SilverlightNotepad
{
    public partial class Page : UserControl
    {
        public int intPortalID;
        public int intModuleId;
        public int intUserID;
        public string strPassword;
        public string strWebServiceBase;
 
        public Page()
        {
            // Required to initialize variables
            InitializeComponent();
            Loaded += new RoutedEventHandler(Page_Loaded);
        }
 
        #region Page_Loaded
        void Page_Loaded(object sender, RoutedEventArgs e)
        {
            // Get parameters from the Tag
            char[] delimiterChars = { ',' };
            string[] strParameters = this.Tag.ToString().Split(delimiterChars);
 
            intPortalID = Convert.ToInt32(strParameters[0]);
            intModuleId = Convert.ToInt32(strParameters[1]);
            intUserID = Convert.ToInt32(strParameters[2]);
            strPassword = strParameters[3];
            strWebServiceBase = strParameters[4];
 
            ShowSilverlightNotepad();
 
            this.btnSave.Click += new RoutedEventHandler(btnSave_Click);
        }
        #endregion
 
        #region ShowSilverlightNotepad
        private void ShowSilverlightNotepad()
        {
            BasicHttpBinding bind = new BasicHttpBinding();
            EndpointAddress MyEndpointAddress = new EndpointAddress(strWebServiceBase + "SilverlightNotepadWebService.asmx");
            var proxy = new SilverlightNotepadWebServiceSoapClient(bind, MyEndpointAddress);
 
            proxy.GetNotepadContentsCompleted += new EventHandler<GetNotepadContentsCompletedEventArgs>(proxy_GetNotepadContentsCompleted);
            proxy.GetNotepadContentsAsync(intPortalID, intModuleId, intUserID, strPassword);
        }
 
        void proxy_GetNotepadContentsCompleted(object sender, GetNotepadContentsCompletedEventArgs e)
        {
            this.txtContents.Text = (string)e.Result;
        } 
        #endregion
 
        #region SaveNotepad
        void btnSave_Click(object sender, RoutedEventArgs e)
        {
            BasicHttpBinding bind = new BasicHttpBinding();
            EndpointAddress MyEndpointAddress = new EndpointAddress(strWebServiceBase + "SilverlightNotepadWebService.asmx");
            var proxy = new SilverlightNotepadWebServiceSoapClient(bind, MyEndpointAddress);
 
            proxy.SaveNotepadContentsAsync(intPortalID, intModuleId, intUserID, strPassword, this.txtContents.Text);
            SaveAnimation.Begin();
        } 
        #endregion
    }
}

From the toolbar, select Build, then Build Solution

Notice the SilverlightNotepad.xap file is now in the ClientBin folder of the SilverlightDesktop website.

Step #7: Register the module

Navigate to the first page of the SilverlightDesktop through the web browser. Click the Login link.

Log in as an administrator.

Click the Go to Administration link.

Navigate to the Module Settings page and enter the following settings on the last line and click the Insert button.

Navigate back to the first page and then click the Go to your SilverlightDesktop link.

The Silverlight Notepad button will display and when you click on it the module will show.

The source code is available on module download page.