Portugal ReMix Silverlight 3 and .NET RIA Services

ReMix in Lisbon, Portugal was a fabulous was to end my ReMix tour. They keynote (as much as I could understand of it) was a lot of fun. They did the Developer\designer egg shtick, but with a real egg!

My this point, I have really hit my stride with the the Silverlight 3 overview I used a this Silverlight 3 deck and did some fun demos:

• IIS Smooth streaming


• The Beatles Rockband site (recently site of the day on FWA site of the day)


• Silverlight 3 Control Toolkit Samples


• Silverlight SEO


• Silverlight 3 Navigation Application Themes


• Slidentity

In the next session, I did was on .NET RIA Services.. You can find the demo I did http://bit.ly/4tmJA3 and the full series. Here is the diagram we used to walk through the options..

Well.. it is a bit sad to be ending my European Tour, but I have had a great time and learned a lot from the great people I meet along the way.

Business Apps Example for Silverlight 3 RTM and .NET RIA Services July Update: Part 26: Authentication and Personalization

The data we work with in business application is valuable. We need to protect the data.. sometimes by keeping up with exactly who accesses and updates what data when and other times we need to actively prevent data from being accessed expected by trust parties.

The web is increasingly becoming a personal place – applications often “know about you” enabling users to having customized settings that work everywhere the apps works.

In this example, I will take our ever popular SuperEmployees application and augment it to show more details on the authentication and personalization.

You can see the full series here.

The demo requires (all 100% free and always free):

1. VS2008 SP1
2. Silverlight 3 RTM
3. .NET RIA Services July '09 Preview

download the full demo files

Basic Authentication

Let’s start by looking at how we ensure that only authenticated users can access access the data and keep a very simple log of who access the data.

Starting with the original example, let’s look at adding authentication to the GetSuperEmployees() method on the DomainService in the server project.

1. [RequiresAuthentication]
2. public IQueryable<SuperEmployee> GetSuperEmployees()
3. {

Once we use the RequiresAuthentication attribute, the system will ensure that only calls from authenticated users make it through. That means we can do some very simple such as logging who is accessing the data and when:

1. [RequiresAuthentication]
2. public IQueryable<SuperEmployee> GetSuperEmployees()
3. {
4. File.AppendAllText(@"C:\users\brada\desktop\userslog.txt",
5. String.Format('{0}: {1} {2}', DateTime.Now,
6. ServiceContext.User.Identity.Name, Environment.NewLine));

(check out a package such as Log4net for a complete solution for logging).

Now when we run the application, no results are returned.

We need to log in to see some results… Luckily the Business Application Template that ships with .NET RIA Services includes great support for this.

Click on login

Notice here, we could change to use window auth to get integrated NTLM security, either way works fine.

Then register now

and we can create a new user directly from the Silverlight client.

Notice if you want to customize the look and feel of any of these dialogs, it is easy to do by looking in the Views\LoginControl.xaml, Views\LoginWindow.xaml.

And if you want to control the backend on how these are implemented, you can by looking in server project under Services\AuthenticationService.cs and UserRegistrationService.cs. By default these go against the ASP.NET Membership and roles system, but you can customize them to do whatever you’d like by simply overriding the methods there.

Now, we just need to react to the logged in event. In this case, I am going to simply reload the data when the user logs in. Lines 10-13 signs up for the logged in event and sets reloads the data, this time, as an authenticated user.

1. public Home()
2. {
3. InitializeComponent();
5. var context = dds.DomainContext as SuperEmployeeDomainContext;
6. originFilterBox.ItemsSource = context.Origins;
8. context.Load(context.GetOriginsQuery());
10. RiaContext.Current.Authentication.LoggedIn += (s, e) =>
11. {
12. if (dds != null) dds.Load();
13. };
15. }

And notice, the client knows who I am:

And the server knows as well.. If you go look at the log file we create in the DomainService we will see:

So, that is cool, but I think we can do a bit better on the client user experience. After all, I get no error whatsoever to tell me I need to log in to see the data.

First, let’s follow best practice and handle the DDS.LoadedData event and simply show any errors that are returned.

1. <riaControls:DomainDataSource x:Name='dds'
2. AutoLoad='True'
3. QueryName='GetSuperEmployeesQuery'
4. LoadedData='dds_LoadedData'
5. LoadSize="20">

Then the implementation is very simple:

1. private void dds_LoadedData(object sender, LoadedDataEventArgs e)
2. {
3. if (e.Error != null)
4. {
5. var win = new ErrorWindow(e.Error);
6. win.Show();
7. }
8. }

Now, when we run this app, we get this error:

That is helpful, maybe for a developer, but for an end user, maybe we want something more explicit.

The first step is to not even make the request if the user is not authenticated. We know that on the client, so this is very easy to do.

First, let’s sign up for the DDS.DataLoading event to capture the load before it happens.

1. <riaControls:DomainDataSource x:Name='dds'
2. AutoLoad='True'
3. QueryName='GetSuperEmployeesQuery'
4. LoadedData='dds_LoadedData'
5. LoadingData='dds_LoadingData'
6. LoadSize="20">

then we will simple cancel the load if the user is not authenticated.

1. private void dds_LoadingData(object sender, LoadingDataEventArgs e)
2. {
3. e.Cancel = !RiaContext.Current.User.IsAuthenticated;
4. }

Now, let’s provide an alternate way to tell the user they need to log on. We simply add some text and make it visible only when the user is not authenticated.

1. <TextBlock Text='Data is only available to authenticated users' Foreground='Red'
2. DataContext='{StaticResource RiaContext}'
3. Visibility='{Binding Path=User.IsAuthenticated, Converter={StaticResource VisibilityConverter}}">
4. </TextBlock>

The implementation of the value convert is pretty simple.

1. public class VisibilityConverter : IValueConverter
2. {
3. public object Convert(
4. object value,
5. Type targetType,
6. object parameter,
7. CultureInfo culture)
8. {
9. bool visibility = (bool)value;
10. return visibility ? Visibility.Collapsed : Visibility.Visible;
11. }
13. public object ConvertBack(
14. object value,
15. Type targetType,
16. object parameter,
17. CultureInfo culture)
18. {
19. Visibility visibility = (Visibility)value;
20. return (visibility != Visibility.Visible);
21. }
22. }

Now, when we run this, we get a nice UX:

Then when we log in, it looks nice.

We can even make it a bit better by giving users an easy to to log in from here:

1. <TextBlock Text="Data is only available to authenticated users. Please click here to log in." Foreground='Red'
2. DataContext='{StaticResource RiaContext}'
3. Visibility='{Binding Path=User.IsAuthenticated, Converter={StaticResource VisibilityConverter}}'
4. MouseLeftButtonUp="TextBlock_MouseLeftButtonUp">
5. </TextBlock>

1. private void TextBlock_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)
2. {
3. new LoginWindow().Show();
4. }

What we showed in this section is how easy it is to require authentication for data and how to create a great user experience for this on the client.

Personalization

Now that we have the basics of authentication down, let’s see how we can provide a bit more of a personalized experience. For many applications, uses spend a huge amount of time in the application, we want them to feel comfortable and in control of their experience. For the first part of this, let’s create a user setting for the background color of the application. Each user can have a different value and it should follow them no mater what machine they run the application on.

Let’s start be defining a profile property in the web.config file.

1. <profile enabled='true' >
2. <properties>
3. <add name='PageBackgroundColor' defaultValue='White'/>
4. </properties>
5. </profile>

Then we can make this strongly typed by adding it to the AuthenticationService.cs file on the server.

1. public class User : UserBase
2. {
3. public string PageBackgroundColor { get; set; }
4. }

Now we can simply access this on the client. First let’s define a page to set this value. in MyFirstPage.xaml… let’s add some UI:

1. <StackPanel Orientation="Horizontal" >
2. <TextBlock Text="Enter background color: "/>
3. <TextBox x:Name='colorTextBox' KeyDown='colorTextBox_KeyDown' Width="100" />
4. <Button Content='Save' Click="Button_Click" />
5. </StackPanel>
6. <TextBlock x:Name="saveStatus"/>

We can handle the save button click as follows..

1. private void Button_Click(object sender, RoutedEventArgs e)
2. {
3. string colorString = this.colorTextBox.Text.Trim().ToLower();
4. colorString = colorString.Substring(0, 1).ToUpper() + colorString.Substring(1, colorString.Length - 1);
5. RiaContext.Current.User.PageBackgroundColor = colorString;
6. this.saveStatus.Text = 'setting saving..';
7. RiaContext.Current.Authentication.SaveUser((o) =>
8. { this.saveStatus.Text = 'setting saved'; },
9. null);
10. }
12. private void colorTextBox_KeyDown(object sender, KeyEventArgs e)
13. {
14. this.saveStatus.Text = '';
15. }

Notice in lines 3-4 we are normalizing the string name of the color so that it is “xaml compliant”..
Then in line 5 we are setting the strongly typed User.PageBackgroundColor property.
Then in lines 6-9 we are simply giving some UI hints as we save this value back to the server.

Of course this will only work if the user is logged in first, so this time, let’s be proactice and encourage the user to log in when they hit the page for the first time.

1. protected override void OnNavigatedTo(NavigationEventArgs e)
2. {
3. if (!RiaContext.Current.User.IsAuthenticated)
4. {
5. new LoginWindow().Show();
6. }
7. }

The last step here is the honor this value when it is set. That turns out to be pretty easy in this case. Just go to MainPage.Xaml and databind the LayoutRoot’s backgroun color to this value.

1. <Grid x:Name='LayoutRoot' Style='{StaticResource LayoutRootGridStyle}'
2. DataContext='{StaticResource RiaContext}'
3. Background='{Binding Path=User.PageBackgroundColor}">

then when we log in…

And if we change the color to blue…

And notice the color change effects the whole app.

And if I hit the app from a different machine, on a different browser, my setting still carries forward… We start off not logged in we get the default:

but when we log in… our settings show up.

Now this is a user specific setting, so if I create a new user “Glenn” and set his background color to pink

that doesn’t effect the background color for Darb…

OK, background color is fun and all, but what might be even more useful is to store some state on how I last left the application. This ensures that as I access the application from over time, the context of my work is preserved.

So, let’s add a few more fields to our profile..

1. <profile enabled='true' >
2. <properties>
3. <add name='PageBackgroundColor' defaultValue='White'/>
4. <add name='SortOrder' type='Int32' defaultValue='0'/>
5. <add name='SortProperty' defaultValue='Name'/>
6. <add name='OriginFilter' defaultValue=''/>
7. </properties>
8. </profile>

then update the User class to make this strongly typed.

1. public class User : UserBase
2. {
3. public string PageBackgroundColor { get; set; }
4. public int SortOrder { get; set; }
5. public string SortProperty { get; set; }
6. public string OriginFilter { get; set; }
7. }

We need to set the UI based on the user’s settings.

1. void LoadUserState()
2. {
3. var user = RiaContext.Current.User;
4. if (user.OriginFilter != null)
5. originFilterBox.Text = user.OriginFilter;
6. else
7. originFilterBox.Text = string.Empty;
9. if (user.SortProperty != null)
10. {
11. dds.SortDescriptors.Add(new SortDescriptor(user.SortProperty,
12. (SortDirection)user.SortOrder));
13. }
14. }

And we need to call that when the page is navigated to…

1. protected override void OnNavigatedTo(NavigationEventArgs e)
2. {
3. LoadUserState();

and when the user logs on.

1. RiaContext.Current.Authentication.LoggedIn += (s, e) =>
2. {
3. User user = RiaContext.Current.User;
4. if (dds != null)
5. {
6. dds.Load();
7. LoadUserState();
8. }
9. };

Next we need to store the values back to the server at the right time. This SaveUserState method plucks the right values out of the UI, and saves them the server if the values have changed.

1. string lastSave;
2. void SaveUserState()
3. {
4. User user = RiaContext.Current.User;
5. if (!user.IsAuthenticated) return;
7. var order = dds.SortDescriptors.LastOrDefault();
8. if (order != null)
9. {
10. user.SortProperty = order.PropertyPath.Value.ToString();
11. user.SortOrder = (int)order.Direction;
12. }
13. user.OriginFilter = this.originFilterBox.Text;
15. if (lastSave != user.SortProperty + user.SortOrder + user.OriginFilter)
16. {
17. RiaContext.Current.Authentication.SaveUser();
18. lastSave = user.SortProperty + user.SortOrder + user.OriginFilter;
19. }
21. }

We need to call this method when the user navigates away.

1. protected override void OnNavigatedFrom(NavigationEventArgs e)
2. {
3. SaveUserState();
4. }

and, periodically we check to see if we need to save the changes back to the server. So we set this up in the forms constructor..

1. Timer = new DispatcherTimer();
2. Timer.Interval = TimeSpan.FromSeconds(10);
3. Timer.Tick += (o, e) => SaveUserState();
4. Timer.Start();

Now, when we run it.. setup some sort order and a filter

then log out

log back in (from a different machine) and we see it is back just where we left off.

What we saw in this section what how to personalize the user experience based on the user preferences.

Admin UI

In this last section, let’s look at how to build out an admin UI.. What we want to do is provide a page that allows Admins to see all the users and edit their profile settings.

First, let’s go into the AuthenticationService and add some custom methods to return all the users. We should be sure that only users in the Admin role can access this service.

1. [EnableClientAccess]
2. public class AuthenticationService : AuthenticationBase<User>
3. {
4. 
   
5. [RequiresRoles('Admin')]
6. public IEnumerable<User> GetAllUsers()
7. {
8. return Membership.GetAllUsers().Cast<MembershipUser>().Select(mu => this.GetUserForMembershipUser(mu));
9. }
11. private User GetUserForMembershipUser(MembershipUser membershipUser)
12. {
13. return this.GetAuthenticatedUser(
14. new GenericPrincipal(new GenericIdentity(membershipUser.UserName), new string[0]));
15. }

Now, lets add some Silverlight UI to consume this. We will create a new page called “Admin”. The first thing we want to do is to prompt the user to log in if they are not already logged in as a user in the admin role.

1. protected override void OnNavigatedTo(NavigationEventArgs e)
2. {
3. if (!RiaContext.Current.User.Roles.Contains('Admin'))
4. {
5. new LoginWindow().Show();
6. RiaContext.Current.Authentication.LoggedIn += (s, ev) =>
7. {
8. if (dds != null) dds.Load();
9. };
10. }
11. }

Next, we define a DomainDataSource for accessing the AuthenticationService

1. <riaControls:DomainDataSource x:Name='dds'
2. AutoLoad='True'
3. QueryName='GetAllUsersQuery'
4. LoadSize="20">
6. <riaControls:DomainDataSource.DomainContext>
7. <App:AuthenticationContext/>
8. </riaControls:DomainDataSource.DomainContext>
10. </riaControls:DomainDataSource>

then we define some simple UI for working with the data..

1. <activity:Activity IsActive='{Binding IsBusy, ElementName=dds}">
2. <StackPanel>
3. <dataControls:DataForm x:Name='dataForm1'
4. Height='393' Width='331'
5. VerticalAlignment='Top'
6. Header='User Data'
7. ItemsSource='{Binding Data, ElementName=dds}'
8. HorizontalAlignment="Left" >
9. </dataControls:DataForm>
11. <StackPanel Orientation='Horizontal' Margin="0,5,0,0">
12. <Button Content='Submit' Width='105' Height='28'
13. Click="SubmitButton_Click" />
15. </StackPanel>
17. </StackPanel>
18. </activity:Activity>

Now, we run it.. log in but it doesn’t give us any data… why?

Well, the user we created is not an Admin. To make them a Admin, go to the Web Admin tool and add them to the “Admin” role.

Select “Security”

Then under Roles, Add a new role for “Admin”

and under Users, “Manager User”… here you can easily add your user to the role.

Now when I log on and go to the Admin page, I can access the all the user’s settings.

What we saw in this section was how to build an admin UI for your applications.

I hope you found this to be a helpful walkthrough of the authentication and personalization support in RIA Services. Again, you can download the full demo files or check out the full series here.

Enjoy.

Video Posted for Belgium Visual Studio User’s Group: 10 Years of Framework Design Guidelines

As a nice follow up from my Belgium Visual Studio User’s Group: 10 Years of Framework Design Guidelines talk, I saw that they just posted the video (slides+audio).

Enjoy!

Oh, and i must include the shameless plug… Framework Design Guidelines: Conventions, Idioms, and Patterns for Reusable .NET Libraries (2nd Edition)

PDC 2009 – I can’t wait!

Things are really starting to heat up around here as we get ready for the PDC. Just this week I have talked to folks on Silverlight, Visual Studio, Azure, ASP.NET, .NET RIA Services, MEF that all have very cool new stuff to talk about at the PDC.

We just recently announced the Scott Guthrie will be giving one of the keynotes, so you can be sure that will be fun.. You can bet Scott will be talking about the latest from ASP.NET, Silverlight, the .NET Framework and Visual Studio!

I will also be there to talk about building business application in Silverlight… no rotating images or dancing videos in this talk, it will be all about saving you and your end user’s time by taking advantage of the latest in Silverlight, .NET RIA Services and Visual Studio!

Hope to see you there, but there will also be lots of good content on line if you can’t make it..

Find out more information here: http://microsoftpdc.com/

When I have talked to developers in the past about coming to PDC, one of the things has been convincing their boss that it is worth the time and money.. I’d love to hear any success stories you have had. How have you sold the PDC to your boss? what works?

RIA Services Blog Posts – Now in French!

Thanks to Yannick Aristidi we are getting many of the RIA Services posts from my series translated into French!

• Partie 1: les bases de la navigation
• Partie 2: l'accès aux données
• Partie 3: L’authentification

Thanks Yannick, i hope there are many more to come!

Enjoy!

Mozilla and Microsoft work together on WPF\ClickOnce plugins

Recently some friends mentioned that they saw Firefox had block-listed some Microsoft WPF\ClickOnce add-ons. As Mike Shaver (VP Engineering for the Mozilla) noted in his blog post, this action is the result of Mozilla and Microsoft working together to protect customers in relation to Security Update MS09-054.

I think it is very important for Microsoft and Mozilla to collaborate so actively to help protect customers… in this case we all agreed it made sense to add the Microsoft add-in to the block-list. We also heard clearly that many customers, especially enterprise customers are relying on this add-on for their daily work. As such Mozilla and Microsoft are working together to give these customers the best possible experience. Like Mike mentioned, as we learned more about MS09-054, we felt mutually good about re-enabling the clickonce addon and as this security fix hits market saturation, we expect to feel comfortable with re-enabling the WPF add-on as well.

We've heard loud and clear from customers how we need to work better with Mozilla around how our plug-ins and add-ons interact with Firefox. And I can promise you that our group will continue to collaborate with Mozilla to more proactively notify them of the effect of updates in the future to help ensure customers have interoperable solutions for their business needs.

I’d like to thank Mike and his team at Mozilla for their great work on this issue and look forward to working with them in the future.

Index for Business Apps Example for Silverlight 3 RTM and .NET RIA Services July Update

Thanks to all of you who asked… I had to take a sick day today, so this was nice mindless work to get done. Hope you enjoy it!

Part 1: Navigation Basics [Spanish]

Part 2: Rich Data Query [Spanish]

Part 3: Authentication [Spanish]

Part 4: SEO, Export to Excel and Out of Browser

Part 5: Astoria, Add Service Reference and WinForms

Part 6: Data Transfer Objects (DTOs)

Part 7: ADO.NET Data Services Based Data Store

Part 8: WCF Based Data Source

Part 9: POCO and Authentication Provider

Part 10: LinqToSql

Part 11: The Client-Only World

Part 12: DataSet

Part 13: The New Class Library Project

Part 14: Visual Basic (VB) and WPF Support

Part 15: ASP.NET MVC

Part 16: Exposing a WCF Service

Part 17: Evolving an Application

Part 18: Custom Linq Provider

Part 19: ASP.NET Dynamic Data

Part 20: NHibernate

Part 21: Hierarchical Data

Part 22: Separate Solution Files

Part 23: Azure

Part 24: Stored Procedures

Part 25: ViewModel

Part 26: Authentication and Personalization

Comments about Adding…

Comments about extracting the samples from a zip file

Summary

Thanks to David Mora for translation of some of these posts into Spanish.