Saturday, April 21, 2012
#
Today we were rebuilding an old project which used MVC 2. There were a bunch of build errors, which I quickly figured was because of the reference to Microsoft.Web.MVC assembly which was a part of the Futures Preview for MVC 2 before MVC 3 came.
I removed the reference and secondly, I installed MVC 3 on the machine. After that I removed all references to MVC 2 assemblies and added reference to the System.Web.Mvc dll version present in C:\Program Files(x86)\Microsoft ASP.NET\ASP.NET MVC 3\Assemblies.
With that, some of the errors went off. But upon further building the project, I ran into quite a few issues with respect to Razor Views and existing MVC 2 codebase.
My colleague, as paranoid as always wanted to revert back to MVC 2 given that, there would be more work in changing all of them to suit MVC 3 assemblies and it wasn’t required at this time for a project which was working fine. Typical customer style.
Then, I went ahead and removed the reference to MVC 3 and added back the MVC 2 assembly.
Bang came back the error on JsonValueProviderFactory references in Global.asax. After scratching around for sometime, I figured that this assembly is now part of the System.Web.Mvc in MVC 3 whereas if we have to use it in MVC 2, we need to explicitly download and add the MVC 2 Futures Preview available at http://aspnet.codeplex.com/releases/view/41742
Since the code was ported from another machine, this wasn’t copied and just MVC and required assemblies were installed.
I went ahead and installed the MVC 2 features which had the DLL Microsoft.Web.Mvc and after adding a reference to that DLL in the project and then putting up a using Microsoft.Web.Mvc, the error on line JsonValueProviderFactory vanished.
Please note, this is only required if you stick to use MVC 2 and with MVC 3 and above, this is not required.
Also, the MVC 2 futures was an experimental release, so I would assume it wouldn’t be supported and one has to use at one’s own risk.
Cheers !!!
Friday, April 20, 2012
#
One of the key trends becoming more and more popular is the Single Page Application Framework and building applications that behave as native applications running on the machine.
SPA’s have been tried and tested for a while now and with libraries like Knockout.js, Backbone.js becoming more and more capable, it becomes feasible to create SPA’s.
What is an SPA?
I can describe in length but falling in line with DRY principle, here is the Wiki Link http://en.wikipedia.org/wiki/Single-page_application
But in short, it is a framework that builds highly responsive web applications that don’t infuse post backs and page reload.
I can almost hear you say.
“Wait!! Isn’t that what AJAX and XMLHttpRequest promised?”
“Can’t I do it with Iframe?”
Hence this post, “Why SPA” now
Traditional web developers have tried using a variety of means to do this Single Page Application using Iframes, XMLHttpRequest, AJAX, jQuery and a variety of libraries. There are caveats to each of these approaches.
First major issue with Iframes is the ability to communicate between the parent and the iframe. 80% of questions about Iframe in various forums (including my most popular blogpost on iframe) are about communication between the page in iframe and the parent.
The next with respect to asynchronous call backs is that, the URL doesn’t get updated and this causes 2 issues
1. There aren’t much URLs and hence the website isn’t search engine friendly
2. Users press the “Back” button and get an unexpected behaviour since the browser history is not updated and hence takes them to different locations instead of the previous stage.
How Single Page Application solves these issues?
Single Page Applications use a parameterized URL which defines various operations that you do. For example, it may append an action to the base URL as below
http://localhost:2015/Task/?editItem=added5
Secondly, SPAs use history.js library (native.history.js) for maintaining the state of the page, so even though all the operations happen quickly and on the client side, the browser’s back button behaves normally and the page state is saved.
In addition to solving the above problems, SPA’s use a combination of template binding scripts, Data Model Scripts, Services and Data Templates making it all the more richer in functionality, to build.
Finally, SPAs integrate well with the new HTML5 features such as LocalStorage and Application Cache for building Offline Web Applications and make it easy to build apps that behave the same when not connected.
What does Microsoft have for developers?
In MVC4 Beta, there is Single Page Application Template that allows you to build SPAs with minimal effort. The default template comes with all the required libraries wired up and a sample ToDoItem.cs file which is the model for data. Upon building the solution and creating a TasksController which is based on the ToDoItem Model, one can navigate to the base URL + Tasks to experience creating /editing Tasks all of it in a Single Page Experience, both quick and elegant.
And since this post has been all talk and no technical tip, here below is one.
The Default SPA Template that comes up when you create a “File – New – ASP.NET MVC 4 Web Application – Single Page Application” Project which was released along with VS11 Beta is a bit out dated now.
Once the SPA Template Project is created, we need to run the NuGet command line utility (Tools – Package Manager Console) and type Install-Package SinglePageApplication.CSharp
This gives a much improved SPA Template to work with as outlined by Steve Sanderon himself, in his blog post.
Cheers !!!
Saturday, February 25, 2012
#
This post is in continuation with my earlier post, so you may want to read that first before continuing.
Once I removed all the TasksController files and the TodoItem, I chose the Models folder, right click and “Add New Item” and searched for “ADO.NET Entity Model” and added it to the folder.
It allowed me to connect to the Northwind database through “Generate from database” and I selected just three tables “Products”, “Categories” and “Suppliers” table for simplicity. At the end of the wizard, we get a EDMX design file with the 3 tables. On this screen I right clicked and choose “Add Code Generation Item” as below
and then in the dialog that came up, chose the “ADO.NET DbContext Generator” and Added (note, if you don’t see this template, you probably don’t have Entity Framework 4.1 installed)
This step created the Model1.Context (not required for us though 
) and the Model1.tt template which groups the individual class files for each of the tables above (these are required )
The next thing I did, was to remove the NorthwindEntities connectionstring that got automatically added when we followed the ADO.NET Entity Model wizard. We don’t need this connection string.
Also, I deleted the Model1.Context file and also the Model1.cs files which are not required (we will be generating a new context to suit our database name)
Note that these files are not required only for our SPA approach here and they are required when working with EF CodeFirst normally as they do the DbSet Tracking and whole bunch of things
So, we now have the basic model classes required for wiring up our Controller required to create the SPA Pages. One important thing I learnt in this process was that, I had to edit the Model classes as follows:-
In Supplier.cs added the “private” keyword to the ICollection<Products> property. Same is the case with Category.cs. Otherwise you would run into an error explained here.
After this, I added Controller for Products as per the settings below (Right Click Controller – Add –Controller)
Note several important things. I have chosen the “Single Page Application with read/write actions and views, using Entity Framework” template under Scaffolding options. Also, I have edited the Data context class and made it simply MvcApplication126.Models.Northwind. This would be referenced in the web.config connection string as well so that SPA picks up our existing Northwind database instead of creating a new one.
Once you click “Add” the following files are generated.
Under Controllers
- NorthwindController.cs
- NorthwindController.Product.cs
- ProductsController.cs
Under Scripts
Under Views
- Products folder and the Views and Partial Views required
Repeat the steps for adding Controllers for “Categories” and “Suppliers” and the only change would be the respective Model Classes.
One important thing to do is to add the following connectionstring to the web.config file
<add name="Northwind" connectionString="Data Source=SERVERNAME;Initial Catalog=Northwind;User Id=YOUR USER NAME;Password=YOUR PASSWORD" providerName="System.Data.SqlClient" />
Then, when you run the project, it opens up the default Home Page.
- Navigate to /Products and it should load the list of Products from Northwind database.
- Click on each product and edit and note that everything happens in a single page inline.
- Just notice the URLs change in pattern with hash tags.
- Notice that the Categories and Suppliers are wired up as dropdownlists since these are foreign key references.
- Notice that all the items load asynchronously
I went ahead and edited the Shared –> Layout.cshtml under Views folder to add Menu Items for Products, Categories and Suppliers, as below:-
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("Products", "Index", "Products")</li>
<li>@Html.ActionLink("Categories", "Index", "Categories")</li>
<li>@Html.ActionLink("Suppliers", "Index", "Suppliers")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
Now, we have our full blown Northwind Traders Application running as a SPA.
You can download the sample from https://skydrive.live.com/redir.aspx?cid=069f94a102eff49a&resid=69F94A102EFF49A!919&parid=root
I have also hosted the sample online at http://northwindspa.cloudapp.net/
Cheers !!!
Single Page Application Frameworks are gaining popularity in the ever evolving web community with lot of libraries such as JavaScriptMVC, Backbonejs and many other libraries. ASP.NET MVC 4 introduces experimental support for building single page application (SPA) through a template. Much of the plumbing work of wiring up the client side scripts, javascript modelviews and the controllers is automated, making it a quick start to develop SPAs relatively easier. Lets examine a scenario where we are building a Northwind Store using SPA.
I installed the ASP.NET MVC 4 Beta for Visual Studio 2010 and the Northwind Sample Database for SQL Server
Post that I did a “File – New Project – ASP.NET MVC 4 Web Application”
In MVC 3 we are used to see a screen with 3 options i.e. Intranet, Internet and Empty templates. In MVC 4 we have additional templates as you can see below and I chose the “Single Page Application” template and created the project template.
The default template creates the scaffolding templates for Models, Views and Controllers as it would do for any regular ASP.NET MVC Project. The differences with SPA template is that, it adds a Model class “ToDoItem.cs” and opens it up by default. The next step as outlined here in the ASP.NET Site Getting Started with SPA Page is to build the solution as this Model gets registered into the Models dictionary and then adding a Controller named “TasksController” which would use this “ToDoItem” as Model class and creating a new DataContext class and then running the solution. When you run the solution and navigate to /Tasks, you get to see nice javascript based Tasks Page where one can create Tasks, Edit Tasks etc., I went little into examining the kind of files created and found that it creates a ContextNameController and ContextNameController.Model.cs file inside the Controllers in addition to the actual Controller we created which in our case is TasksController.
Next, the important folder 
is the Scripts folder and there I found that it creates a <Modelname>ViewModel.js file that holds all the observer pattern script required. In addition, this folder contains a truckload of JavaScript files including jQuery, Knockout, upshot and modernizr.
Finally, inside the “Views” folder, it creates the necessary Partial Views and Index View for Tasks. Once you build and run, you can experience all of this SPA for your TodoItem Model without having written a single line of JavaScript code yet.
Now, things I learnt
1. The ContextName that you select when creating the TasksConroller (inour case it is MVCApplication126Context)is important for you to work with other Databases. By default when you run this solution, Visual Studio would create a SQL Express Database in C:\Program Files\Microsoft SQL Server\MSSQL10.SQLEXPRESS\MSSQL\DATA folder with the name MVCApplication126Context.
The way I see the SPA framework identifies is, if you don’t have a connectionstring by the name of the Context, it defaults to creating a database in SQL Express with the ContextName in the above mentioned path.
If you have a connectionstring mentioned with the same contextname, it tries and uses that Database (SQL Express, SQL Server). However, when you are running for the first time, if you create a Database and point it in the connectionstring, it would expect that the Table (mapped to the model i.e. TodoItems) need to exist. Otherwise, it throws an exception. So best, is to either use a Model for which there is a Table that already exists in the Database or provide a new Database name in which case, VS would create the Database with the TodoItems Table as well. There must be someplace to configure all of these, but for the lack of time I didn’t delve deep into these things for now.
So, coming to our Northwind Sample. Northwind has been Developers’ best friend to experiment new things and the saga continues here.
I had to do a couple of things though. First I removed the TodoItem.cs class and also removed the TasksController, Views since we don’t need them. So, for all practical purposes, it is now a plain MVC 4 Application with the default Home & Account Controllers and their respective Views. I also removed the Contextfiles created inside the Controllers Folder.
A bit of analogy on how I built this Northwind App before I explain the actual steps.
The TodoItem is a simple class file and can be hand wired. However, in real world, or for that matter, a simple Northwind database table has a lot of columns and hence properties to be wired up. Also, it requires to map foreign relationships and other things. So, I decided to use the ADO.NET Entity Data Model first to create a model class for the Northwind Database. This would help me in generating DbContext classes using EF CodeFirst Template, which are much simpler than the complex EDMX file that is created by the ADO.NET Entity Model. Thereafter, I can use the class files generated to create the Controller, View and JS ViewModels.
More on these in the next part!!!
Monday, January 16, 2012
#
Tuesday, January 10, 2012
#
Once you upgrade to the Windows Azure SDK 1.6 you also get the updated Microsoft Service Bus assemblies (version 1.6.0.0) that you can use for working with Windows Azure Service Bus (yeah, no longer AppFabric Service Bus)
One of the standard implementations of Service Bus is to use the CredentialType, Credentials (the service bus namespace and the issuer key and issuer name) to create the service bus namespace URI.
Once you upgrade to Windows Azure Service Bus (Microsoft.ServiceBus) version 1.6.0.0, the following are the errors you might encounter. These are rather warnings.
'Microsoft.ServiceBus.TransportClientCredentialType' is obsolete
'Microsoft.ServiceBus.TransportClientEndpointBehavior.CredentialType' is obsolete: '"This property is deprecated. Please use TransportClientEndpointBehavior.TokenProvider instead."'
'Microsoft.ServiceBus.TransportClientEndpointBehavior.Credentials' is obsolete: '"This property is deprecated. Please use TransportClientEndpointBehavior.TokenProvider instead."'
'Microsoft.ServiceBus.TransportClientEndpointBehavior.Credentials' is obsolete: '"This property is deprecated. Please use TransportClientEndpointBehavior.TokenProvider instead."'
While this is nicely documented in the release notes, the new equivalent for this is Token Provider. So here below is a sample implementation code which uses Token Provider and TransportClientEndPointBehaviour namespaces.
Uri serviceUri = ServiceBusEnvironment.CreateServiceUri("sb", serviceNamespace, "SERVICE NAME”);
// create the credentials object for the endpoint
TransportClientEndpointBehavior sharedSecretServiceBusCredential = new TransportClientEndpointBehavior();
TokenProvider tokenProvider = tokenProvider.CreateSharedSecretTokenProvider(issuerName, issuerSecret);
sharedSecretServiceBusCredential.TokenProvider = tokenProvider;
// create the channel factory loading the configuration
ChannelFactory<IDirectoryService> channelFactory = new ChannelFactory<IDirectoryService>("DirectoryEndpoint", new EndpointAddress(serviceUri));
channelFactory.Endpoint.Behaviors.Add(sharedSecretServiceBusCredential);
Cheers!!!
I have been working on Windows Azure Service Bus for the recently concluded Azure Camps
Yes, it is no longer referred as “Windows Azure AppFabric Service Bus”. All the 3 components i.e. Service Bus, Access Control and Caching are hereinafter referred to as simply Windows Azure Service Bus, Caching & Access Control Service, to minimize the complexity in referring to them.
Also, Service Bus and the related releases usually come as an out of bound release and are usually behind in terms of the Windows Azure SDK releases. The Windows Azure SDK latest release is the 1.6 version and along with, there is also a new version of the Service Bus. Earlier, the Service Bus assemblies sit inside the C:\Program Files\Windows Azure AppFabric SDK folder.
With the 1.6 version of the release of SDK, the Service Bus assemblies also sit inside the regular Windows Azure SDK folder. Therefore, you can find the latest version of Service Bus i.e. Microsoft.ServiceBus sits inside C:\Program Files\Windows Azure SDK\v1.6\ServiceBus\ref folder.
Similarly, the Caching assemblies sit inside C:\Program Files\Windows Azure SDK\v1.6\Cache\ref folder.
The latest version of ServiceBus is hence 1.6.0.0 and hence if you are installing, you need to make sure you update the assembly version in the config files.
Otherwise, you would typically get the wrong assembly referenced error, as follow
Exception type: System.Configuration.ConfigurationErrorsException
Message: Configuration binding extension 'system.serviceModel/bindings/netTcpRelayBinding' could not be found. Verify that this binding extension is properly registered in system.serviceModel/extensions/bindingExtensions and that it is spelled correctly.
Particularly, if you are using the http://www.microsoft.com/download/en/details.aspx?id=19925 Azure AppFabric samples, they reference the older version of the assembly. And you need to update them. The release notes http://msdn.microsoft.com/en-us/library/windowsazure/hh667331.aspx covers pretty much line by line on the binding changes to be included in the config file.
So, now, whether you develop for Windows Azure Hosted Services, Storage Services or Windows Azure Service Bus you need to install, just one SDK and all of them reside under the C:\Program Files\Windows Azure\SDK folder.
In my subsequent post, I want to cover a specific deprecated assembly, its implementation and the new equivalent.
Cheers !!!
Wednesday, December 21, 2011
#
The opinions mentioned herein are solely mine and do not reflect those of my employer in any way...
Monday, December 19, 2011
#
Tuesday, December 13, 2011
#
I was playing with the new Membership API (System.Web.Providers) for the upcoming
Virtual TechDays
While I was trying out a lot of options for using as DB store, one of the obvious choices was SQL Azure. With SQL Azure, I could offload the Database hosting capabilities to Azure and just focus on my application code. Of course, it comes at a cost and SQL Azure is a subscription based database available in different sizes and rates there of.
One of the challenges I faced was, working with the Membership API’s connectionstring called as “DefaultConnection”. The Default Connection is something you would use simply for all connection strings once you upgrade the application to use the New Membership API. While configuring the connection string, I copied an existing connection string of SQL Azure and changed just the database name.
The new Membership API is supposed to create the database if it doesn’t exist and then use it for creating tables for storing users, roles, etc., It failed!!
The error precisely I got was the title i.e. “EFProviders require MultipleActiveResultSets=True for System.Data.SqlClient connection strings.”
I was doubly sure that the attribute existed in connection string and moved it around, as much closer to the other attributes i.e. User Id, Database name etc., Still no luck.
This connection string had earlier worked with SQL Azure in another application earlier and I was also damn sure about it. The only difference was that application wasn’t using the new Membership API.
Then, I changed the case of the attribute (lowercase) to camel case to make it “MultipleActiveResultSets” and voila, it worked!!
I couldn’t believe that this was the problem but eventually figured that, indeed it was 
So, if you hit the above error and are sure that the attribute exists, make sure, it is of pascal case. The Membership API doesn’t like it in other formats
Cheers!!!
Thursday, November 17, 2011
#
This is the 5th post in the series of HTML5 for ASP.NET Developers
Support for HTML5 in Visual Studio 2010 has been quite good with Visual Studio Service Pack 1
However, HTML5 Boilerplate template has been one of the most popular HTML5 templates out in the internet. Now, there is one for your favorite ASP.NET Webforms as well as ASP.NET MVC 3 Projects (even for ASP.NET MVC 2). And its available in the most optimal place, i.e. NuGet.
Lets see it in action. Let us fire up Visual Studio 2010 and create a “File – New Project – ASP.NET Web Application” and leave the default name to create the project. The default project template creates Site.Master, Default.aspx and the Account (membership) files.
When you run the project without any changes, it shows up the default Master Page with the Home and About placeholder pages.
Also, just to check the rendering on devices, lets try running the same page in Windows Phone 7 Emulator. You can download the SDK from here
Clearly, it looks bad on the emulator and if we were to publish the application as is, its going to be the same experience when users browse this app.
Close the browser and then switch to Visual Studio. Right click on the project and select “Manage NuGet Packages”
The NuGet Package Manager dialog opens up. Search for HTML5 Boilerplate. The options for MVC & Web Forms show up. Click on Install corresponding to the “Add HTML5 Boilerplate to Web Forms” options.
It installs the template in a few seconds. Once installed, you will be able to see a lot of additional Script files and also the all important HTML5Boilerplate.Master file.
This would be the replacement for the default Site.Master. We need to change the Content Pages (Default.aspx & other pages) to point to this Master Page. Example <%@ <% Master Language="C#" AutoEventWireup="true" CodeBehind="Html5Boilerplate.Master.cs" Inherits="WebApplication14.SiteMaster" %> would be the setting in the Default.aspx Page.
You can do a Find & Replace for Site.Master to HTML5Boilerplate.Master for the whole solution so that it is changed in all the locations.
With this, we have our Webforms application ready with HTML5 capabilities. Needless to say, we need to wire up HTML5 mark up level code, canvas, etc., further to use the actual HTML5 features, but even without that, the page is now HTML5’ed. One of the advantages of HTML5 (here HTML5 is collectively referred for CSS3, Javascript enhancements etc.,) is the ability to render the pages better on mobile and hand held devices.
So, now when we run the page from Visual Studio, the following is what we get. Notice the site.icon automatically added. The page otherwise looks similar to what it was earlier.
Now, when we also check this page on the Windows Phone Emulator, here below is what, we get.
As you can see, we definitely get a better experience now. Of course, this is not the only HTML5 feature that we can use. We need to wire up additional code for using Canvas, SVG and other HTML5 features. But, definitely, this is a good starting point.
You can also install the HTML5boilerplate Template for your ASP.NET MVC 3 and ASP.NET MVC 2 from the NuGet packages and get them ready for HTML5.
Cheers !!!
Thursday, November 03, 2011
#
One of the cool things about HTML5 is the ability to play audio/video files out of the box without the dependency on plugins. Earlier I had written about HTML5 Video and the fallback using Silverlight for non-supported scenarios
Visual Studio 2010 SP1 has decent support for HTML5, in terms of intellisense, validation etc., But, one issue that is constantly faced when using the HTML5 Video tag in an ASP.NET Application (Web/MVC) built using Visual Studio is that, the videos doesn’t play when running the application from Visual Studio on IE9.
Taking a step back, Visual Studio uses ASP.NET Development Server as the default setting when debugging and running applications on the local machine. The ASP.NET Development Server (also called as Cassini) has been there ever since Visual Studio 2005 days.
So, I created a simple MVC Application with “File – New - Project – ASP.NET MVC 3 Web Application” and left the defaults to create an Application. I added a videos folder and added a H.264 encoded mp4 video (one of the supported HTML5 Video formats) inside the folder.
Then, I added the following line of code in the “Index.cshtml” file.
<video src="@Url.Content("~/Videos/video.mp4")" id="myVideo" controls ></video>
All I got was the above. Basically a broken link. I verified that the path is right and the video is indeed playable on Windows Media Player etc.,
The issue was that, since by default Visual Studio uses the ASP.NET Development Server and the ASP.NET Development Server doesn’t have the flexibility to configure MIME types, It doesn’t understand the video format and hence could not play. When I ran the application on IE9 and checked the Network Tab of the Developer Toolbar, all I got was what you see below
I switched the Project to use IIS Express using “ProjectName” – Right Click – Properties – Web Tab
Still had the same result. Since IIS Express also doesn’t have the MIME Type to play video, configured by default, it couldn’t recognize the video and couldn’t play it.
The simple option is to configure it to use the “Actual IIS” (in the above screen, remove the check from “Use IISExpress”) which can play the video.
But, thankfully this blog post has steps on how to configure MIME types for IIS Express. Only thing is, I had to change it for configuring the MIME type for playing MP4 video.
So, the steps are
1. Click on Start button
2. Type CMD
3. Right click on the CMD that is listed and choose “Run as Administrator”
4. Do a cd to navigate to the IIS Express directory CD “Program Files (x86)”\”IIS Express”
5. And then run the following command
appcmd set config /section:staticContent /+[fileExtension='.mp4',mimeType='vieo/mp4']
That’s it. When I re-ran the application, it could play the video.
Please note, I was unable to configure or figure out how to do it for the ASP.NET Development Server. So, if we need to play HTML5 Video from Visual Studio we either need to use IIS Express or use the full fledged IIS. And from the performance and configuration perspective IIS Express offers a lot more than ASP.NET Development Server and hence it makes more sense to use IIS Express for local development.
Cheers !!!
Tuesday, November 01, 2011
#
Much has been the expectation about Silverlight 5 ever since the fire-starter in December 2010
Silverlight 5 has been the expectation of every SL developer ever since the SL4 release and the huge momentum surrounding HTML5 on the web. While HTML5 is definitely promising, Silverlight and other proprietary plugins have their own strengths in terms of rich capabilities such as Digital Rights Management which have evolved to a great extent.
In MIX 2011, Scott Guthrie unveiled Silverlight 5 Beta among much fanfare! You can read about the complete list of Silverlight 5 Beta features
In the meantime, Silverlight 5 RC is available for download from here
Cheers !!!
Wednesday, October 26, 2011
#
If you are active on Facebook, there is very less chance that you missed on the recent Facebook UI update “Social Graph” or more popularly referred as “Timeline” (a screenshot of how the Timeline profile UI looks, here below)
This Timeline UI has been quite popular and is supported in most of the modern browsers including IE9, Chrome 14 & Firefox 6 and above.
I am a power consumer of web and use IE9 as my primary browser. Timeline UI works excellent in IE9.
I have also downloaded the IE10 Platform Preview for Windows 7, which provides greater support for some of the HTML5 standards.
Also, with Windows Developer Preview ships the IE10 Developer Preview (a newer version after IE10 PP2). This has the best possible support for CSS3 transitions and other latest web standards.
Both in IE10 PP2 and IE Developer Preview, Facebook Timeline UI doesn’t show up. It shows the classic view although I have enabled timeline. Gut feel is, they are doing browser sniffing and with the user agent not enabling the Timeline for not matching major version 9 in case of IE. Actually IE10 PP2 and Developer Preview have better support for CSS3 and other new web standards. So, to enable Timeline UI in IE10 PP2 or the IE Developer Preview shipped in Windows Developer Preview, we need to use the IE Developer Toolbar (press F12)
So, here is the view of Facebook Profile in IE Developer Preview which features by default Browser Mode IE10.
Once we change the browser mode to IE9, I get the social graph view as below
I tested the same in both IE10 Developer Preview (Windows Developer Preview) and IE10 PP2 (Windows 7) and got the desired results 
Goes on to prove my earlier posts on how the Developer Toolbar in IE is very helpful for Developers.
And here is a nice video on how to enable Facebook Timeline for your account.
I think it is these little nifty changes that separates we developers from the regular consumers
Cheers !!!