Implementing XamSchedule Solution in Silverlight Applications Using a WcfListDataConnector

[Infragistics] Mihail Mateev / Saturday, October 30, 2010

XamSchedule suite offers a WcfScheduleDataConnector to use a data from different sources via WCF service.

It is very easy to create a multi user applications that have calendar or other scheduling features.
When schedule application uses a data on a remote server the best approach is to use WcfScheduleDataConnector instead ListScheduleDataConnector.
In this case connector will be responsible for communication between client and server side. Otherwise using a ListScheduleDataConnector developers must implement this functionality.

The WcfListScheduleDataConnector offers two classes for WCF Service on the server side: WcfListConnectorServiceSingle and WcfListConnectorServiceMulti.
A WcfListConnectorServiceSingle provides list schedule data to the client. Only one instance of this service class will be created and all remote calls will be run on the same thread. This reduces overhead on each remote call, but because of this, this service should only be used when it is known that a relatively small number of clients will be connecting to the service. If there too many clients or timeouts when using WcfListConnectorServiceSingle the WcfListConnectorServiceMulti is recommended.
In the sample is used a WCF service which provides list schedule data to the client. WCF service class, named Test2008DataService inherits WcfListConnectorServiceMulti class to demonstrate an application with more clients, connected to the service. A new instance of this service will be created for each remote call into the service and calls may be made on different threads. Data sources provided to this service are thread safe.

There are three important moments:

Project database to have corresponding data types to Resource ResourceCalendar and Activity (Appointment, Task, Journal) properties.
Otherwise, you need to implement your own data conversion before filed mapping.
Methods override in WcfListConnectorServiceMulti inheritor.
Set an EndPoint in the client configuration file:
The remote WCF service can be specified in two different ways. A service endpoint can be defined in a configuration file or the remote address and binding can be specified directly on the connector. The easiest way to define the location of a remote WCF service and use it in multiple clients in an application is to define an endpoint in the configuration file (ServiceReferences.ClientConfig) and set to WcfListScheduleDataConnector.EndpointConfigurationName the name of the endpoint configuration .

Demo application will demonstrate a simple way to start with a multi user scheduling application, that uses a SQL Server 2008 database and a WcfListConnectorServiceMulti .

Requirements:

Visual Studio 2010
Silverlight 4 Tools for Visual Studio 2010
Silverlight 4 Toolkit
SQL Server 2008 R2 - Express or higher license
One of these distributions:

Steps to reproduce a demo application.

Download Test2008R2 database and attach it to SQL Server 2008 R2 (Express or higher license)
Create a Silverlight Application, hosted in ASP.Net web application.
Add a reference to Infragistics4.Services.Schedules.WcfConnectorService.v10.3 in the web project.
Add a new LINQ to SQL Classes mapped to the relational objects Resources, ResourceCalendars, Appointments, Tasks and Journals.
Add a WCF Service named Test2008DataService in the Web project that inherits WcfListConnectorServiceMulti.
Override these methods on Test2008DataService class (including mapping fields):
GetItemSource
InitializePropertyMappings
OnRemoteCallReceived
OnRemoteCallProcessed
OnActivityAdded
OnActivityChanged
OnActivityRemoved
Set endpoint in the Web.Config
Define an endpoint in the configuration file (ServiceReferences.ClientConfig)
Add a WcfListScheduleDataConnector in the Silverlight Application.
Set to WcfListScheduleDataConnector.EndpointConfigurationName the name of the endpoint configuration
Add a XamScheduleDataManager.
Add UI components from Schedule Suite: XamDayView, XamScheduleView, XamMonthView
Implement a multi resource and multi calendar support.
Implement a runtime change of the view type
Implement a runtime support for calendar display mode.
Run the application.

Download Test2008R2 database and attach it to SQL Server 2008 R2 (Express or higher license)

Download Test2008R2 database, extract it and attach it to your SQL Server

Create a Silverlight Application, hosted in ASP.Net web application

Create a Silverlight Application, hosted in ASP.Net web application and named XamScheduleWCFService.

Add a reference to Infragistics4.Services.Schedules.WcfConnectorService.v10.3 in the web project.

Add a new LINQ to SQL Classes mapped to the relational objects Resources, ResourceCalendars, Appointments, Tasks and Journals.

Add a new LINQ to SQL Classes, named Test2008R2DataClasses mapped to the relational objects Resources , ResourceCalendars, Appointments, Tasks and Journals.

Override the methods on Test2008DataService class:

GetItemSource:

private Test2008R2DataClassesDataContext dataContext;

  

        protected override IEnumerable GetItemSource(ItemSourceType listManagerType)

        {            

            switch (listManagerType)

            {

                case ItemSourceType.Appointment:

                    return this.dataContext.Appointments;

  

                case ItemSourceType.RecurringAppointment:

                    return null;

  

                case ItemSourceType.Resource:

                    return this.dataContext.Resources;

  

                case ItemSourceType.ResourceCalendar:

                    return this.dataContext.ResourceCalendars;

  

            }

  

            return null;

        }

InitializePropertyMappings – there is implemented fields mapping.

protected override void InitializePropertyMappings(ItemSourceType itemSourceType, object mappings)

{

    switch (itemSourceType)

    {

        case ItemSourceType.Appointment:

            ((AppointmentPropertyMappingCollection)mappings).UseDefaultMappings = true;

            break;

  

        case ItemSourceType.RecurringAppointment:

            ((AppointmentPropertyMappingCollection)mappings).UseDefaultMappings = true;

            break;

  

        case ItemSourceType.Resource:

            ((ResourcePropertyMappingCollection)mappings).UseDefaultMappings = true;

            break;

  

        case ItemSourceType.ResourceCalendar:

            ((ResourceCalendarPropertyMappingCollection)mappings).UseDefaultMappings = true;

            break;

  

    }

}

OnRemoteCallReceived

protected override void OnRemoteCallReceived(CallContext context)

{

    this.dataContext = new Test2008R2DataClassesDataContext();

    base.OnRemoteCallReceived(context);

}

OnRemoteCallProcessed

protected override void OnRemoteCallProcessed(CallResult result)

{

    base.OnRemoteCallProcessed(result);

  

    this.dataContext.Dispose();

    this.dataContext = null;

}

OnActivityAdded

protected override void OnActivityAdded(ActivityAddedEventArgs args)

{

    base.OnActivityAdded(args);

    this.dataContext.SubmitChanges();

}

OnActivityChanged

protected override void OnActivityChanged(ActivityChangedEventArgs args)

{

    base.OnActivityChanged(args);

    this.dataContext.SubmitChanges();

}

OnActivityRemoved

protected override void OnActivityRemoved(ActivityRemovedEventArgs args)

{

    base.OnActivityRemoved(args);

    this.dataContext.SubmitChanges();

}

Set endpoint in the Web.Config

Check the Web.Config file to ensure that the endpoint for WCF service is properly set, You need to have a contract from type: Infragistics.Services.Schedules.IWcfListConnectorService.

<?xml version="1.0"?>

  

<!--

  For more information on how to configure your ASP.NET application, please visit

  http://go.microsoft.com/fwlink/?LinkId=169433

  -->

  

<configuration>

    <connectionStrings>

        <add name="Test2008R2ConnectionString" connectionString="Data Source=.\SQLExpress;Initial Catalog=Test2008R2;Integrated Security=True"

            providerName="System.Data.SqlClient" />

    </connectionStrings>

    <system.web>

        <compilation debug="true" targetFramework="4.0" />

    </system.web>

  

    <system.serviceModel>

        <behaviors>

            <serviceBehaviors>

                <behavior>

                    <serviceMetadata httpGetEnabled="true" />

                    <serviceDebug includeExceptionDetailInFaults="false" />

                </behavior>

            </serviceBehaviors>

        </behaviors>

      <serviceHostingEnvironment multipleSiteBindingsEnabled="true" />

        <bindings>

            <customBinding>

                <binding name="CustomBinding1">

                  <binaryMessageEncoding>

                    <readerQuotas maxStringContentLength="2147483647" />

                  </binaryMessageEncoding>

                  <httpTransport authenticationScheme="Anonymous" />

                </binding>              

            </customBinding>

        </bindings>

        <services>

            <service name="XamScheduleWCFService.Web.Test2008DataService">

                <endpoint address="" binding="customBinding" bindingConfiguration="CustomBinding1"

                    contract="Infragistics.Services.Schedules.IWcfListConnectorService" />

                <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" />

            </service>

        </services>

    </system.serviceModel>

  <system.webServer>

    <modules runAllManagedModulesForAllRequests="true"/>

  </system.webServer>

</configuration>

Define an endpoint in the configuration file (ServiceReferences.ClientConfig)

Modify your ServiceReferences.ClientConfig file (if you have no ServiceReferences.ClientConfig – create it follow the sample below):

<configuration>

  <system.serviceModel>

    <bindings>

      <customBinding>

        <binding name="MyCustomBinding">

          <binaryMessageEncoding />

          <httpTransport maxReceivedMessageSize="2147483647" maxBufferSize="2147483647" />

        </binding>

      </customBinding>

    </bindings>

    <client>

      <endpoint address="http://localhost:41558/Test2008DataService.svc"

        binding="customBinding" bindingConfiguration="MyCustomBinding"

        contract="WcfListConnectorServiceSL.IWcfListConnectorService"

        name="MyEndpointConfigurationSQL" />      

    </client>

  </system.serviceModel>

</configuration>

Add a WcfListScheduleDataConnector in the Silverlight Application.

<ig:WcfListScheduleDataConnector 

            Name="DataConnector" />

Set to WcfListScheduleDataConnector.EndpointConfigurationName the name of the endpoint configuration

Set in XAML defined in ServiceReferences.ClientConfig endpoint to WcfListScheduleDataConnector.EndpointConfigurationName

<ig:WcfListScheduleDataConnector 

            Name="DataConnector"

            EndpointConfigurationName="MyEndpointConfigurationSQL"

            PollingInterval="00:00:10"

            PollingMode="Detailed" Loaded="DataConnector_Loaded"  

            />

Add a XamScheduleDataManager.

<ig:XamScheduleDataManager Name="DataManager" CurrentUserId="mdour"  DataConnector="{Binding ElementName=DataConnector}" >

     <ig:XamScheduleDataManager.Settings>

         <ig:ScheduleSettings>

             <ig:ScheduleSettings.AppointmentSettings>

                 <ig:AppointmentSettings AllowEdit="True"  AllowResizing="StartAndEnd"/>

             </ig:ScheduleSettings.AppointmentSettings>

         </ig:ScheduleSettings>

     </ig:XamScheduleDataManager.Settings>

 </ig:XamScheduleDataManager>

Add UI components from Schedule Suite: XamDayView, XamScheduleView, XamMonthView

<ig:XamDayView Grid.Row="1" Name="xamDayView1" Margin="5" BorderBrush="Black" MultiDayActivityAreaVisibility="Collapsed"

                              DataManager="{Binding ElementName=DataManager}" ActiveCalendarChanged="DayView_ActiveCalendarChanged"

                               />

        <ig:XamScheduleView HorizontalAlignment="Stretch" Grid.Row="1" Name="xamScheduleView1" VerticalAlignment="Stretch" 

                            DataManager="{Binding ElementName=DataManager}" Visibility="Collapsed" />

        <ig:XamMonthView HorizontalAlignment="Stretch"  Grid.Row="1" Name="xamMonthView1" VerticalAlignment="Stretch" 

                            DataManager="{Binding ElementName=DataManager}" Visibility="Collapsed" />

Implement a multi resource and multi calendar Support.

Two methods are added in the MainPage: SetAllCalendars and SetResource

SetAllCalendars displays the calendars of all resources.

#region SetAllCalendars

private void SetAllCalendars()

{

    this.DataManager.CalendarGroups.Clear();

    foreach (Resource resource in this.DataManager.ResourceItems)

    {

  

        if (resource != null)

        {

            CalendarGroup group = new CalendarGroup();

  

  

            foreach (ResourceCalendar calendar in resource.Calendars)

            {

                if (calendar != null)

                {

                    group.Calendars.Add(calendar);

                }

  

            }

  

            this.DataManager.CalendarGroups.Add(group);

        }

  

    }

  

    this.cboResources.SelectedIndex = -1;

  

}

#endregion //SetAllCalendars

SetResource displays the calendar of specific resource.

#region SetResource

private void SetResource(Resource resource)

{

  

    this.DataManager.CalendarGroups.Clear();

  

    CalendarGroup group = new CalendarGroup();

  

    foreach (ResourceCalendar calendar in resource.Calendars)

    {

        if (calendar != null)

        {

            group.Calendars.Add(calendar);

        }

  

    }

  

    this.DataManager.CalendarGroups.Add(group);

}

#endregion //SetResource

Implement a runtime change of the view type

In the page layout is added a ListBox control with items for each view – day view, schedule view and month view.

<ListBox x:Name="ListScheduleViews" Margin="5 0 5 0"   SelectionMode="Single"  SelectionChanged="ListScheduleViews_SelectionChanged">

    <ListBox.ItemsPanel>

        <ItemsPanelTemplate>

            <StackPanel Orientation="Horizontal" Margin="0" />

        </ItemsPanelTemplate>

    </ListBox.ItemsPanel>

    <ListBoxItem x:Name="DayViewItem" Content="Day View" Tag="DayView" Margin="0 0 10 0" IsSelected="True" />

    <ListBoxItem x:Name="ScheduleViewItem" Content="Schedule View" Tag="ScheduleView" Margin="0 0 10 0" IsSelected="False" />

    <ListBoxItem x:Name="MonthViewItem" Content="Month View" Tag="MonthView" Margin="0 0 10 0" IsSelected="False" />

</ListBox>

When the selection is changed , an event calls an event handler that is changing the visibility of the three UI controls XamDayView, XamScheduleView and XamMonthView.

#region ListScheduleViews_SelectionChanged

private void ListScheduleViews_SelectionChanged(object sender, SelectionChangedEventArgs e)

{

    ListBoxItem item = e.AddedItems[0] as ListBoxItem;

    if (item != null)

    {

        SetScheduleMode(item.Tag.ToString());

    }

}

#endregion //ListScheduleViews_SelectionChanged

  

#region SetScheduleMode

private void SetScheduleMode(string viewName)

{

    if (this.xamDayView1 == null || this.xamMonthView1 == null || this.xamScheduleView1 == null)

    {

        return;

    }

  

    switch (viewName)

    {

        case "DayView":

            this.xamDayView1.Visibility = System.Windows.Visibility.Visible;

            this.xamMonthView1.Visibility = System.Windows.Visibility.Collapsed;

            this.xamScheduleView1.Visibility = System.Windows.Visibility.Collapsed;

            break;

        case "ScheduleView":

            this.xamDayView1.Visibility = System.Windows.Visibility.Collapsed;

            this.xamMonthView1.Visibility = System.Windows.Visibility.Collapsed;

            this.xamScheduleView1.Visibility = System.Windows.Visibility.Visible;

            break;

        case "MonthView":

            this.xamDayView1.Visibility = System.Windows.Visibility.Collapsed;

            this.xamMonthView1.Visibility = System.Windows.Visibility.Visible;

            this.xamScheduleView1.Visibility = System.Windows.Visibility.Collapsed;

            break;

    }

}

#endregion //SetScheduleMode

Implement Runtime Support for Calendar Display Mode.

Changing the Calendar Display Mode is described in article How to Use Infragistics XamSchedule Solution

Run the application:

Click on the “SecondaryCal” calendar.

Look at the calendar: the new appointment has added.

Resize the appointment to change end time and make a duration 1 hour.

Click on the calendar “MateevCal”, owned from mmateev resource.
Add a new appointment with a name “Blue Sheet meeting”.

Make the selected appointment recurrent.
In the activity dialog click on “Recurrence” button.
Set options in the Recurrence pattern: weekly recurrence each Friday. Add Range of recurrence “No end date”

Close the recurrence settings.

Now the last added appointment is recurrent.

Look at the sample database “Test2008R2”:
new appointments are added in the table “Appointments”.

Change the calendar display mode to overlay.

Change the resources:
Change the current resource to “Mihail Mateev”.
Only calendars, owned from this user are visible.

Change the current resource to “Mike Dour”.

Click on “All users” Button to display all calendars for all resources
and change calendar display mode to “Separate”.

Change the view type to “Schedule View”.Change the view type to “Month View”.
All calendars are displayed now in a month view.

Demo application you could find here:

Sample data base could be downloaded here: