Flickr web app with MVC preview 3 [Cont..]

In my last post, I have mentioned of creating Flickr app with Asp.net MVC. In recent update I have modified it with Asp.net MVC Preview 3.

You can find a general reference about the project here. But in this post, I will say, what are the changes due to the new release and where to start especially.

In previous release of ASP.net MVC you had RenderView, which lets you render your UI right from the controller and controller classes are with void return type, now with new release this is slightly changed. In case of the FLickrViewer app, I have a PhotoController, where I did the following changes.

public ActionResult Tags(string name, int? page)
{
    ViewData["Title"] = name;

    PhotoData photoData = new PhotoData();
    
    // ........ more code here  ......

    return View(photoData);
}

As you can see, the data is passed as ActionResult by a View routine, in this way it becomes more TDD friendly, where I don't need to mock HttpContext to compare results from Test class. From UI layer. Also, it lets you have different sets of results in ViewData. For example, i want to populate View's Title property from ViewDataDictionary and get the tags from its Model.

Therefore, I can do the following to have dynamic browser title

<title> Photos for tag - <%= ViewData["Title"] %> </title>

And, then access the Model property to get PhotoData.

<% 
    if (ViewData.Model != null)
    {
        foreach (FlickrViewer.Web.Objects.PopularTag tag in ViewData.Model)
        {
            // .. actual code
        }
    }%>

Pretty cool, in terms of separating result and UI data. :-).  Another good update is the routing helpers. We can now ignore particular URL extensions to be sent to controllers by IgnoreRoutes and can use the new easy construct called MapRoute for mappping URLs to controllers.

In global.asax, we can register and ignore routes like

public static void RegisterRoutes(RouteCollection routes)
{
    routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
    routes.MapRoute("Detail", "Photo.mvc/Detail/{photoId}", 
                     new { controller = "Photo", action = "Detail" });
}

These are few of loads of new additions to MVC Preview 3. In coming posts, I will tell more about how to use Ajax with MVC to construct master-detail UI, but you can check it out easily by digging into the source.

The source can be divided into four parts

    1. UI - that uses Asp.net Ajax and JS and Html to render things out.
    2. PhotoController - prepares the data for rendering.
    3. PhotoModel -> talks with Flickr using LINQ.Flickr.
    4. A separate test project that uses NUNIT and Rhino mock to test controller.

All together it makes out a MVC project :-). Again, get the copy of the source from www.codeplex.com/flickrviewer and live URL is http://flickrmvc.net.

Thanks

kick it on DotNetKicks.com

No Comments