Nov 122009
 

The audience which the web was catering to, has drastically changed in the last 10 years. From primary being a one way of source of information for its users, the web has evolved into a massive aggregator with which users can both create and consume information. This meant a sea change for web developers and application designers where they had to make their User interface much more interactive and closer to windows applications.

Adobe Flash and Microsoft Silverlight are a step in that direction. Groundbreaking animation is possible with these technologies. We will take a look at some simple animation in Silverlight today. First the simplest animation possible. The Double animation works by moifying a double property of the application in a time bound way. Suppose we want to create a rectangle that disappears and reappears every second. Lets take a look at the XAML.

<UserControl x:Class="SLAnimation.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
  <Grid x:Name="LayoutRoot">
        <StackPanel >
            <StackPanel.Resources>
                <Storyboard x:Name="AppStoryBoard">
                    <DoubleAnimation x:Name="clickAnim"
                                     Storyboard.TargetName="animRectangle"
                                     Storyboard.TargetProperty="Opacity"
                                     From="1.0" To="0.0" Duration="0:0:1"
                                     AutoReverse="True"
                                     RepeatBehavior="Forever" />
                </Storyboard>
            </StackPanel.Resources>
            <TextBlock TextAlignment="Center" FontSize="30" FontFamily="Verdana">Double Animation in Silverlight</TextBlock>
            <Rectangle x:Name="animRectangle" MouseLeftButtonDown="animRectangle_MouseLeftButtonDown"
                       Width="200" Height="100" Fill="Red" ></Rectangle>
        </StackPanel>
    </Grid>
</UserControl>

If you see this code, the animation is defined in the Storyboard tag which contains the code of how exactly the animation will behave. It specifies the target control and also the property which has to be altered. Then we give the for loop for changing the transparency along with the step property. Once the story board is done, you need to write the control which is the target of the StoryBoard, a simple rectangle. However, a presence of a storyboard is not enough to start the animation. This is done in the code behind.

        public MainPage()
        {
            InitializeComponent();
        }
 
        private void animRectangle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
        {
            AppStoryBoard.Begin();
        }

Even this can be achieved through XAML alone as we will see in the next example. In this looping animation two rectangles will move to the opposite ends of the canvas before returning. The best part is there is no code behind involved. The Storyboard is triggered by the EventTriggers tag in Silverlight. This time the property that is modified is the Canvas.Left. One rectangle already has this property set to 0 and one has it to 280. And in the storyboard, there are respective DoubleAnimation tags added. One of them increases the first rectangle’s Canvas.Left property from 0 to 280 and the other vice versa. Since the RepeatBehavior is set to Forever, it seems like an endless loop.

<Canvas>
<Canvas.Triggers>
<EventTrigger RoutedEvent="Canvas.Loaded" >
<EventTrigger.Actions>
    <BeginStoryboard>
        <Storyboard x:Name="animRectangle1"
                    Storyboard.TargetName="Rectangle1"
                    Storyboard.TargetProperty="(Canvas.Left)" RepeatBehavior="Forever">
            <DoubleAnimation To="280" Duration="0:0:15"></DoubleAnimation>
            <DoubleAnimation To="0" Storyboard.TargetName="Rectangle2" Duration="0:0:15"></DoubleAnimation>
        </Storyboard>
    </BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</Canvas.Triggers>
<TextBlock TextAlignment="Center" FontSize="30" FontFamily="Verdana">Moving Animation in Silverlight</TextBlock>

<Rectangle x:Name="Rectangle1" Canvas.Left="0" Canvas.Top="40" Width="20" Height="20" Fill="red"></Rectangle>
<Rectangle x:Name="Rectangle2" Canvas.Left="280" Width="20" Canvas.Top="40" Height="20" Fill="Blue"></Rectangle>
</Canvas>

So we saw how easy it is to create simple animation with Silverlight. Below is a simple preview of the application. And as one more demonstration of the platform independent nature of Silverlight, I just wrote the object tag for the Silverlight .xap file and thats it, it works in WordPress’s PHP without any hiccups.

Get Microsoft Silverlight

Nov 082009
 

Microsoft Silverlight 3 includes support for creating Rich Internet Applications with virtually no code at all. In this article, I will create a simple RIA application which displays data from the SQL Server 2005 AdventureWorks database. For those who are wondering what RIA services are? Its a pattern which integrates ASP.NET with Silverlight and provides a simple way to write n-tier applications. What I admired about RIA services applications are it brings your database logic to your business layer. What that means is that your database and Data access layer virtually contains no application specific code at all. In future, upgrading, migrating to any other database is amazingly simple. There is the element of a performance implication while using Linq though, which needs to be taken into consideration. Thanks to Sachin Rathi from Microsoft for his session in TechDays where he taught about this new topic.

So lets jump into it. First the tools, which can be downloaded from here. The fifth point in the list is the RIA kit. Once thats done, you would have a new template – Silverlight Business Application.

newProject

So like we saw in the previous blog, there are two applications created – one for our Silverlight application and one for the ASP.NET application. The basic application is already created with a decent theme.

businessApp

Lets create a new xaml page for displaying our data created by the RIA applications. Right click on the Views folder and add a new Silverlight page.

addnewPage

addnewItem

Now that the new Silverlight page is created, lets add a link to it from the main page. Add this markup after the link to the about page.

<Rectangle x:Name=”Divider2″ Style=”{StaticResource DividerStyle}”/>
<HyperlinkButton x:Name=”Link3″ Style=”{StaticResource LinkStyle}”
NavigateUri=”/EmployeesPage” TargetName=”ContentFrame” Content=”Employees”/>
Once thats done, we need to add any database from which to retrieve data from. I will use the sample AdventureWorks database. Copy the database file to the App_Data folder. Now what is needed is a Entity Data model. The Entity data model generates a ER data model by analyzing the database. Right click on the web project and add a new item – AdventureWorks.edmx. In the next screen click on Generate from database. The ED model automatically detects the database files and generates the connection string. Click next and select the employee table alone in the next screen.
edmxModel
edmodel
This step generates the entity relationship model for the database, and make the code “aware” of the underlying database. In later steps we could write Linq queries against the database. The next step would be to add a new domain service class, the item template for which has been installed already.
domainService
domainServiceOpts
To the domain service class that was automatically generated, add a new method GetSalariedEmployees.
public IQueryable<Employee> GetEmployees()
{
return this.Context.Employee;
}
public IQueryable<Employee> GetSalariedEmployees()
{
return this.Context.Employee
.Where(emp => emp.SalariedFlag == true);
}
Then add a new datagrid to the EmployeesPage.xaml. A reference needs to be added to the Windows.Controls.Data assembly. Also a namespace is added to the datagrid. The markup is as below.
employeeMarkup
Now that the datagrid is loaded, lets add the namespace for the Application in the xaml page. Here is the finished xaml file.
finishedXaml
It can also be done through code like this.
employees _eObj = new employees();
public EmployeesPage()
{
InitializeComponent();
this.dataGrid.ItemsSource = _eObj.Employees;
_eObj.Load(_eObj.GetEmployeeQuery());
}

This application is by no means over, we can add sorting, filtering, updating rows to this with as little code as possible. More about it in future posts.

Nov 072009
 

Silverlight is Microsoft’s answer to Adobe Flash, used to display multimedia, animation and graphics in Internet applications. Its a subset of Windows Presentation Foundation and uses a vector graphics rendering engine to deliver much better graphics than conventional web images.

With each release Microsoft is working on bringing Silverlight and WPF closer to each other. Prism is one such implementation which allows applications to be written without knowing the end platform in mind. In this blog I will explain how to write a simple application and XCOPY deploy it to a shared web hosting provider, in my case godaddy.

First open up Visual Studio. For this walkthrough I have used Visual Web Developer 2008 which is a free software and can be downloaded here. You would also need the Silverlight SDK consisting of the runtime environment and the toolkit, all of which can be downloaded at the Silverlight page.

First open up Visual Web Developer. Click on File -> New Project. If the tools were installed correctly, you should see a new Project type Silverlight Application in the list.

newProject

The next screen asks if you want to host your silverlight application in an ASP.NET website. This is really optional since Silverlight is independant from ASP.NET. It can be hosted on your HTML, PHP, JSP application with equal ease. The only thing needed is the .XAP file.

newApp

The solution is created and if you look at it there, are two projects. One is the Silverlight project with App.xaml and MainPage.xaml. Another project is the ASP.NET website which is the host for the Silverlight application. The xap file is contained in the ClientBin folder.

Solution_Exporer

In the godaddy Hosting manager, click on IIS management and create a virual directory which is setup as an application.

IISSettings

Now lets see the project. Click on MainPage.xaml to see the markup for the MainPage. Copy this markup between the grid element. Unfortunately the HTML tags aren’t working properly when I copy paste them to the blog. Hence posting the screenshot.

postMarkup

Then you need to modify the web.config and set the custom errors mode = off. Then using a FTP client copy all the host website files into the virtual directory that you created. And thats it. Your first sample silverlight website.

Nov 042009
 

Though Azure has been a “hot” word for nearly an year now, I didnt really look into it much. Sure everyone was talking about Cloud Computing and how it would define the web in the years to come, but there was no motivation for me to go and dive head first into Azure. That motivation came today at the Tech Days event at a Session on Azure. So I decided to write a blog on how Azure would be beneficial from a customer’s point of view. Will follow it up with a post on the technical details.

azure

Azure is Microsoft’s very own Cloud Computing platform. It will allow organizations to focus their attention solely on their business purposes rather than IT centric points like capacity, load balancing etc. So the only activity for maintaining an application would be in development and testing, and Azure would do the rest of the magic for you. This means lesser resources would be required for maintaining an application and you wont  require a full time Support guy on call just in case something goes wrong.

So how does this work? Microsoft has many data centers across US and is in the process of opening many more. These data centers house tens of thousands of servers, which are used for virtualization and creating VMs where the client application is hosted on. Each VM is a system with a 2 Ghz processor and 250GB disk space, which acts as the server for your application. Suppose there is a sudden surge in traffic and the application VM is getting overloaded, the client can immediately request for another VM instance (it costs extra money of course). In real time, a new VM instance would be created and the application be copied to it and with that your site has instant extra capacity, with absolutely no downtime at all!!! So no more need for planning for that sudden festive season rush to your site and paying for the extra hardware all year long. Azure’s pay as you go model is extremely economical and would work out to be far more cheaper than what most companies currently spend on their IT Infrastructure.

The first thought that came to my mind was whether organizations would be able to host Azure on their own datacenters rather than relying on Microsoft to provide hosting. But Alas, it is not to be. Steven Martin wrote on his blog quite some time back “We don’t envision something on our price list called ‘Windows Azure’ that is sold for on-premises deployment”. I am hoping that this is temporary, till Azure is stable enough to hand over a third party and some day, it would be available for on-premise development. For very large organizations, it makes a lot of sense to maintain their own data center which would be more reassuring from a security point of view. And VMs could be shared between applications. Instead of having buffer capacity for each application as in the current model, all the applications on the network could share a common buffer which could be interchanged between apps instantly.

Another issue is the permissions. On dedicated servers, we have the luxury of operating with full privileges for both Windows and IIS. On Azure, where inspite of having a separate VM, a single server could be shared for multiple applications, would the customers have the same level of control.

There are many more questions and concerns like these which need to clarified. The PDC is coming up in another 2 weeks. Lets hope there will be more clarity then.

Nov 042009
 

Microsoft Tech Days officially kicked off today at my workplace in Bangalore, India. The event inauguration was done with the traditional lamp lighting by Stephen Elop, President, Business Solution Division, Microsoft. My Company’s joint CEO was present for the inaugration as well.

techdays-2009_thumb[1]

There are more than 50 sessions lined up and the faculty are architects from Microsoft with more than 12-13 years of experience.

The first day was immensely enlightening with the focus on a brand new technology that Microsoft is betting big time on -Windows Azure. Microsoft’s enthusiasm on Cloud is contagious with more and more people trying out and writing about it. Being still occupied with trying to unravel Rotor, I am yet to download the Windows Azure SDK and try it out. Will have to hurry though, the trainer mentioned that the tokens used to download the SDK might not be free after December.

Oct 282009
 

Microsoft is conducting a three day TechDays Event at work from November 4th to 6th. A wide range of topics will be covered including latest Microsoft technologies like Windows 7, Visual Studio TS 2010, Exchange Server 2010, Sharepoint 2010, Silverlight and Azure among others.

techdays-2009_thumb[1]

I immediately nominated myself for it lest the number of slots get over. There are also separate tracks for developers, architects and IT professionals, totally having more than 20 sessions each day. I hope we get to choose the sessions to attend rather than being tied to a particular track as this would make the whole event more flexible.

Will post whatever new I learn there!!!

Oct 222009
 
Windows 7

Windows 7

Microsoft has finally announed the pricing of retail versions of its newest operating system Windows 7 in India. The software giant has kept the price 20% lower than other regions in an attempt to tackle piracy.

There is bad news though, because Microsoft has a tax dispute with Indian customs over the new tax rules for imported Software, the release of Windows 7 is delayed till this dispute is resolved.

A basic home version of Windows 7, available only in emerging countries such as India, is priced at Rs 5,899, excluding taxes, while the high-end version, Windows 7  Ultimate, will cost Rs11,799. In the US, the high-end version costs $320 (Rs 15,000).

But this announcement is not that significant since more than 90% of the Windows software sold in India is bundled with PCs and laptops. These versions are what are called as OEM (Original Equipment manufacturers) version. Microsoft is yet to announce its pricing for this segment.

Since my laptop is made by an OEM, I am one of those in the limbo without any news about the upgrade. Though the retail version is an option, its cost is highly unattractive. OEM versions of Windows are many times cheaper than retail versions, since these are not supported by Microsoft rather its the OEM’s responsibility to do.

As always, will post in case of any updates.