Mehfuz's WebLog : Linq.Flickr

Asp.net MVC more Form post scenarios and Ajax

mehfuzh — Sun, 28 Sep 2008 19:54:01 GMT

In the flickr explorer app made with Asp.net MVC and Athena, I was trying out some form post scenarios. In this post, I will add few things regarding MVC form post and Ajax that is common to FlickrXplorer but can be used in general.

Now, Asp.net MVC has some new Ajax features, one of this is the Ajax form post. With this, you can easily make your web app actions Ajax enabled. The syntax is pretty simple.

<% using (Ajax.Form("AddComment", "Comment", new AjaxOptions { UpdateTargetId = "cmContainer", 
           OnBegin = @"function(sender, args) {
                $get('caWait').style.display = 'block';
           }", 
           OnSuccess = @"function(sender, args) {
             $get('caWait').style.display = 'none';
           }", 
          }))
                            
       { %>

...
...

<% } %>

The piece of snippet is taken from FlickrXplorer : CommentsControl.ascx where I used MVC Ajax to do comment posts. Here you can see that I can pass in the UpdateTargetId , where the output of ContentResult or if it is ViewResult, it will contain the rendered html for it. Additionally, there is OnBegin and OnSuccess events where I can do things like show or hide the wait panel and any other things I might like to do.

On the client code , probably in your default.master you need to have the following references to make things work.

<script type="text/javascript" src="<%= Page.ResolveClientUrl("~/Content/MicrosoftAjax.js") %>" ></script>
<script type="text/javascript" src="<%= Page.ResolveClientUrl("~/Content/MicrosoftMvcAjax.js") %>" ></script>

Now, this is one way of doing things out. This basically injects the Ajax script in onsubmit of the html form where the actual magic happens. Now, this is not the only way, you might need to do custom tasks before the submission takes place, like check if the user has written something before pressing the submit button or selected his country dropdown before pressing checkout in an air-ticket inventory system. For this kind of issue, here is another cool way that it can be done.

function doAjaxSubmit(form, e, waitPanelId, targetToUpdate, methodName) {
    
    var isValid = true;
    
    if (typeof methodName != 'undefined')
    {
        var validate = Function.createDelegate(this, methodName)    
        isValid = validate(form, null);
    }

    if (isValid) {

        if (e == null) return false;
        
        Sys.Mvc.AsyncForm.handleSubmit(form, new Sys.UI.DomEvent(e),
        {
            insertionMode: Sys.Mvc.InsertionMode.replace,
            updateTargetId: targetToUpdate,
            onBegin: Function.createDelegate(form, function(sender, args) {
                $get(waitPanelId).style.display = 'block';
            }),
            onSuccess:
            Function.createDelegate(form, function(sender, args) {
                $get(waitPanelId).style.display = 'none';
            })
        });

    }
    else {
        return false;
    }
}

So, I have written a tiny JS routine that is a similar script that Ajax.Form injects in onsubmit event of html form but with few changes. As, we can see that I need to pass the form instance (this), event (in this case submit), the target where the update will be pushed in and a delegate method if provided it will process the submit only if it passes the validation written by the implementer.

In the FlickrXplorer : CommentsControl.ascx i have modified previous the html block like

<% 
IDictionary<string, object> formParams = new Dictionary<string, object>();
formParams.Add("onsubmit", @"return doAjaxSubmit(this, event, 'caWait', 'cmContainer', function(sender, args) 
{
    return validateRequiredText('errComment', 'txtComment');
});");

using (Html.Form("Comment", "AddComment", Microsoft.Web.Mvc.FormMethod.Post, formParams))
                    
{ %>

<%= Html.Hidden("photoId", photoId) %>
...
...

<% 
} %>

In this case, I have converted the Ajax.Form to Html.Form, where I have hooked the onsubmit with doAjaxSubmit routine with few parameters. Inside the call back method, I have written the required logic for validating required field. So, if people lefts the comment textarea intentionally blank and tries to do a post he might see.

Now, moving on to the next section, I would like to like see my pager do MVC form post but I would like to see a continue of parents parameters. Let's take the use case.

In other words, I need to delegate form action from parent to child. There are plenty of ways to do it. In my way, I have created a HtmlHelper extension method that prepares my child form with query params that come from the parent request.

public static string RenderRequiredFormPostElements(this HtmlHelper htmlHelper, string paramToExclude)
{
    string url = HttpContext.Current.Request.Path;

    StringBuilder builder = new StringBuilder();
    NameValueCollection queries = HttpContext.Current.Request.QueryString;

    foreach (string name in queries.AllKeys)
    {
        if (string.Compare(name, paramToExclude, true) == 0)
        {
            //skip
        }
        else
        {
            builder.Append(htmlHelper.Hidden(name, new {value = queries[name]}));
        }
    }
    return builder.ToString();
}

Here it renders html hidden elements based the current url, also I can pass in a particular query param (in this case "page") which I don't want to be processed. Finally, in the FlickrXplorer : Pager.ascx i have added the following lines

<form name="pagerForm" method="GET" action="<%= HttpContext.Current.Request.Path %>">

<%= Html.Hidden("page") %>         
<% = Html.RenderRequiredFormPostElements("page") %>             

...
...

Here, to include that pager action is bound to the current url , which is in turn bound to an action in the controller class. Therefore, in this case Request.Path points to an action url /Photo/{action} with paging value. Also, the possible action methods for which paging value will be supplied need to handle the case if there is no paging.

That's all for now. All the example are shown here, ties to Asp.net MVC 5. You can find codes running at www.codeplex.com/flickrXplorer , please go to the source tab to grab the nightly build.

Enjoy !!!

Athena - A LINQ to flickr API (Release 1.4)

mehfuzh — Sat, 02 Aug 2008 09:07:51 GMT

Last week, I released a new version of LINQ.flickr, which I named as Athena from release 1.4. It covers few features from flickr service, also now I have updated it with the latest LINQExtender (pre release version) containing updated Object Tracking Service (OTS) that will enable it to update photos and comments as if like LINQ to SQL.

First of the interesting features that most others asked me to implement is the Extras support, with this you can get additional information about your photos by querying with Extras enum.

var query = (from photo in context.Photos
            where photo.SearchText == "Redmond" && p.Extras == (ExtrasOption.Views 
| ExtrasOption.Date_Taken | ExtrasOption.Date_Upload)
            select photo).Skip(0).Take(10);

This will return 10 photos contains word "Redmond", additionally it will have Photos.Views , Photos.TakeOn and Photo.UploadedOn that user might find useful. The extras options is provided by flickr and it has options like GEO, tags , etc.

Athena , now covers two new endpoints.

flickr.photos.setMeta and flickr.photos.comments.editcomment.

Comment comment = (from c in context.Photos.Comments
where c.Id == "1234"
select c).Single();
 
comment.Text = "This is a updated comment.";
coment.SubmitChanges();

This will update the comment for me. Notice that it tracks the object for update and automatically fires the appropriate method to do the update. It comes as a part of enhanced LinqExtender OTS which I will describe a bit more in other post about how to implement it.

Finally, the easy authentication method that I already described in my previous post, take a look at that as well. Also, the coming update will have photo set support and watch out for that as well. There are few new development updates like one click test and deployment package creation with NAnt that lets me update my app with the latest source without running IDE and test program. There are also a lot of re-factors and performance enhancements that makes the API more stable.

That's it. Enjoy and file me bugs!!

Making authenticated calls to flickr

mehfuzh — Mon, 28 Jul 2008 19:16:23 GMT

There are few things to know , when getting photos from your stream , adding comments and overall doing adding and deletion of your photos. As with flickr you can take a look at this url => http://www.flickr.com/services/api/auth.spec.html for authentication spec to learn more. But with Athena (formerly known as LINQ.Flickr) it's pretty easy to get things going. Last week, I made an update to the FlickrXplorer (The MVC starter project you don't want to miss :-)) project that now enables you to add comments for photos. There is a one click login that will take you to flickr, ask you once for the permission to grant the app for data access and finally will take you back to the place from where you were left off.

Now, concept with MVC app is to call a controller url , and finally point flickr to a second controller url that will bring the user to last page, if everything works fine. This whole thing is done by Athena on behalf without a single line of code on client app.

To start off , lets create a context class.

FlickrContext context = new FlickrContext();

Authentication done in two ways, first one is the auto authentication.

var query = from photo in context.Photos
                    where photo.SearchText == "Home" && photo.ViewMode == ViewMode.Owner
                    select photo;

This query tries to search in my photo stream with word "Home", where the owner is the caller himself. This will automatically take me to the flickr authentication page. However, this is good for desktop based application, where it will fire up the browser , let me authenticate and on closing, it will continue from next line of code. This will also work for web apps, but in case if we need to do something else on successful return, we need a manual way for sure.

context.Authenticate();

Lets say, I call /Photo/Security/Auth url which runs the above line in the controller class that will eventually fire the authentication process. Here to note that once the authentication process is complete all the successive calls will return Authentication token class, which we can use for showing user status or like "Welcome XYZ...".

AuthToken token = context.Authenticate();

if (token != null)
{
   People people = (from p in context.Peoples
                               where p.NsId == token.UserId
                               select p).Single();
// do the rest.
}

Finally, if we are on a public computer, we surely don't want to leave without logging off. So, there should be a manual call for that as well.

context.ClearToken();

And, it says all. Technically, Athena stores a token in the App Directory for desktop application with the given path in config for FlickrSettings. In web application, it stores the token in user's browser cookie with 30 days of lifeline for current site which of course goes out as soon as you logout. Token is used by flickr for validating authenticated calls and also by the API to make useful decisions in minimizing service calls.

Hope that gives some light on those who likes to give authenticated features to their personal photo app without much of hair loss.

Again, check things out : www.codeplex.com/linqflickr.

Implement Master-Detail layout with ASP.NET MVC

mehfuzh — Sun, 29 Jun 2008 19:48:00 GMT

This is the first of posts that I am making to show out the things you can do with ASP.NET MVC. Also, it shows what I have done while building FlickrXplorer. I am bit lazy to write one article for it, so I thought rather to start it here.

In this post, I will show how you can implement a master-detail layout that invokes MVC controller to process its data and uses Ajax to do it in a non postback manner.

If you have looked though FlickrXplorer, you must have noticed that every list of images is tied with a detail view in a way that if user performs any action on the list ("click") , the detail view is updated accordingly.

Let's see the action flow below

It is almost clear that when you select an image it calls a Controller method or an Action method to be more precise. In this case, let's say that it is /Photo/Detail/112233. To map this a simple line in global.asax follows

routes.MapRoute("Detail", "Photo/Detail/{photoId}",
 new { controller = "Photo", action = "Detail" });

This will result in the call of PhotoController.Detail, when user hits the above url. Inside detail view its pretty simple.

[FilterResponse]
public ActionResult Detail(string photoId)
{
    try
    {
        PhotoDetail detail = model.GetPhoto(photoId); 
        return View(detail);
    }
    catch (Exception ex)
    {
        return View("Error", 
                    new ControllerException
      { ErrorUrl = HttpContext.Request.RawUrl, Message = ex.Message });
    }
}

As, expected it calls the model to get the photo and returns the ViewResult. Here, I haven't done any content related processing rather made a ViewPage named Detail.aspx which the MVC framework calls. By default, MVC framework looks for the ViewPage or ViewControl with name equals to the Action name, but View has other overrides that let me call other ViewPage/ViewControl as well. This is what done above when any error occurs, which calls Shared/Error.aspx. It is to be noted that if you have multiple controller and you want to access the same view from different controller, then you need to place it in the Shared folder, which will make it accessible by all controllers.

In the snippet, we also see that there is a FilterResponse attribute that will cache the response for same parameter set once the first call is made. FlickrResponse is inherited from MVC.ActionFilterAttribute attribute that provides a way to do some custom actions like caching and compression of http content.

So far, I have mapped the url and added the action method. Now, its time to get the result and show them in UI but I don't want any postbacks or redirects for it. So, I have used a callback model that did the work for me.

function renderContent(elementId, loadElementId, url, callback) {
    var element = $get(elementId);
    $get(loadElementId).style.display = "block";

    // Create the WebRequest object.
    var wRequest = new Sys.Net.WebRequest();

    // Set the request Url.  
    wRequest.set_url(url);
    // Set the request verb.
    wRequest.set_httpVerb("GET");
    // Set the Completed event handler, 
    // for processing return data
    wRequest.add_completed(function(sender, eventArgs) 
    {
        if (sender.get_responseAvailable()) 
        {
            element.innerHTML = sender.get_responseData();
            $get(loadElementId).style.display = "none";
            
            if (typeof callback != 'undefined')
                callback();
            
        }
    });
    // Make the request.
    wRequest.invoke();
}

Here, we see that renderContent takes in the Id of the element that will contain the rendered content and loading element that will be visible while the content is being processed. Optionally, we can pass in a parameter-less void callback which can be invoked after the content is processed. In that case, we might like to start the loading of comments after we have rendered the detail page. This renderContent is invoked while a user selects a photo from the list, this is a bit generic method which can be used for any callback scenarios. Therefore, for rendering photo detail, I wrapped it around so that it takes only a photoId.

function renderDeail(photoId, ignoreHash) {
    if (ignoreHash == 0) {
        if (window.location.hash == '') {
            // take the default one 
            window.location.hash = photoId;
        }
        else {
            photoId = getPhotoIdFromHash();
        }
    }
    else {
        window.location.hash = photoId;
    }
    var url = '<%= Html.ActionUrl("Photo", "Detail", new { photoId = "{0}" }) %>';
    url = String.format(unescape(url), photoId);
    renderContent("detailView", "loadingView", url, loadComments);
}

renderDetail takes a photoId and ignoreHash := true/false. Inside, it uses Html.ActionUrl to process the url and then formats it with photoId and finally calls the renderContent. Html.ActionUrl is an extension method which is coded by me, the original is Html.ActionLink. So please dont get confused :-). I could have passed the url by hand but using ActionUrl it creates the url on basis of the route mapping in global.asax. Also, for Photo controller if I change the url from /photo/detail/id to /p/detail/id, then I don't have to go everywhere in order to change the references.

Finally, while loading photo from url, I use window.hash to navigate to the selected photo, which is updated when a photo is clicked to show and thus, I have the master-detail layout yet url copy-paste facility.

That's it for now, I leave it on to the reader to explore it more in Codeplex. Also, hope that the introduction helps. Please note that some of the features like 2nd step loading of comments will be supported from 1.2 release (please check it out), so the JS might slightly differ to what is shown here.

Check it live at flickrmvc.net - send me feedbacks and updates.

Replace SortedDictionary with LINQ query - Part 2 (with comparison)

mehfuzh — Tue, 17 Jun 2008 20:09:16 GMT

In my previous post, I have said that using LINQ query instead of SortedDictionary not only could be useful , elegant but also less processor intensive. In this post, I will show you a real comparison between the same the method but one with SortedDictionary and other with LINQ orderby query. I wrote a simple console application that mimics the action of GetSignature in LINQ.Flickr. Here, I will focus only on the sorting part that's why I removed the hashing and initialization of the method.

So, lets assume there are 10 url pairs that we need to sort for getting the signature. So, we need to create an array of 8 items and the processing method inserts another 2 (api_key and method name). Finally, when I run the two routines and took a snapshot from jetbrain's dottrace , I saw the following

Now, you can see that there are two methods TestSortedItemsWithSortedDic(SortedDictionary) and TestSortedItems (LINQ). The difference is almost 3 times the LINQ orderby query. Expanding the TestSortedItemsWithSortedDic will reveal the following

As you can see that adding items into sorted dictionary takes around 6.37% of the CPU cycle which is definitely because of the sort algorithm that it runs on each add. Also, there is another 1.39% during the initialization. Only these two items take up 7.76%, let alone the other SortedDictionary entries. Now, lets see how the processing with LINQ orderby looks like

LINQ iteration takes up 1.77%(where the original execution take place) , Dictionary.Add takes 0.54% comparing to 6.37% with sorted dictionary and additional orderby and select take 0.17 and 0.14% respectively. So, in total add and sorting takes up to (1.77 + 0.54 + 0.17 + 0.14) 3.39% of CPU cycles. Here to include that, highest CPU index may vary with current load, but the ratio remains almost the same.

Therefore, it is almost clear that we can replace SortedDictionary with LINQ and without it .stripped down version of .net in Silverlight is not a bad idea :-). Also, those who commented on my last post for live comparison thank you !!. You can also download the test code I have used here and run it in dottrace to see it live (I have used dottrace 3.1).

Have fun!!

Replace SortedDictionary with LINQ query

mehfuzh — Mon, 16 Jun 2008 18:43:00 GMT

With LINQ.Flickr it is quite necessary to get signature on parameters in order to do authenticated flickr photo get. As with the signature, it has to be sorted by parameter then to be hashed by MD5. Previously, I used to use SortedDictionary dictionary to do so, but thinking a little bit I learned that we actually don't need SortedDictionary anymore after we have LINQ. May be that's why the product team at Microsoft removed SortedDictionary from stripped down version of .net that comes with SilverLight.

Now, off to code, lets say I want 10 photos from my photo stream in flickr, to achieve that I would simply write

var query = (from photo in context.Photos
            where photo.ViewMode == ViewMode.Owner
            select photo).Take(10);

Behind the scene, it will first try to authenticate me, if I am not already then it will try to do it and finally it will make an authenticated call to get my photos from my flickr account. Using SortedDictionary, the sorting of signature items used to be done on the fly but the overhead is that on every new item inserted in the dictionary due to each parameter of REST call, it runs the sort logic. This is of course a waste of processor speed. So, I replaced all the lines that look like

IDictionary<string, string> sortedSigItems 
= new SortedDictionary<string, string>();

with

IDictionary<string, string> sigItems = new Dictionary<string, string>();

Finally, inside my GetSignature method at BaseRepository of LINQ.Flickr I added the following lines, before final toString stuff.

var query = from sigItem in sigItems
            orderby sigItem .Key ascending
            select sigItem.Key + sigItem .Value;

// do the rest with sorted list.

The whole thing is much pleasing with LINQ query and less processor intensive.So next time when you think about sorting, think about LINQ first :-)

Have fun!!!

Continued with comparison in part 2 of this post.

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

mehfuzh — Sat, 31 May 2008 07:43:18 GMT

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

UI - that uses Asp.net Ajax and JS and Html to render things out.
PhotoController - prepares the data for rendering.
PhotoModel -> talks with Flickr using LINQ.Flickr.
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

Flickr Xplorer - An Asp.net MVC photo app for Flickr

mehfuzh — Mon, 26 May 2008 20:13:00 GMT

I have flushed out a little project at Codeplex called "Flickr Xplorer". Its a Flickr mesh up that lets you search(user, tag, text), jump into user photos, see popular and latest stream and moreover lets you browse the whole Flickr in hacked url way (url routing easy and rocking). The application is made on Asp.net MVC preview 3 and I have used my LINQ.Flickr to communicate with Flickr. The project is an early stage, I will update with new features when possible and how you ask. You can use it as you like , host it to your server to make it a personal dashboard for your taken photos or use it for fast hand on for Asp.net MVC , mocking and of course how to use LINQ.Flickr API :-)

you can try out the demo here http://www.flickrXplorer.net/ (sometimes service may be unavailable due to update pardon me for that). Currently, App is tested under IE 6 & 7, Firefox 2.0+, will update for other browsers as well.

The location for the project : www.codeplex.com/flickrXplorer.

Finally, have fun the new open source Flickr app and ping me if you have any suggestion to make it more interesting.

Enjoy!!

Updated on 29th May 2008 - Asp.net MVC preview 3

Updated on 28th June 2008 - Restructured, renamed and added social features.

Updated on Sep 29 2008 - Update to MVC 5, Please check for the newest updates in source tab and all are pushed to live.

Mock HTTP layer to do complex tasks like uploading photo to Flickr

mehfuzh — Tue, 06 May 2008 05:58:00 GMT

In this post, I will show how you can use Typemock to fake out complex HTTP POST like uploading photo in Flickr server. The example which will be shown here, gives a pretty much generic idea of faking out HTTP calls and gain access to the response stream for comparing result with original content.I have used, N-Unit along with Typemock which run thorough TMockRunner.exe to perform the mock test.

To get started, let's see what is really cooking in PhotoRepository.Upload in LINQ.Flickr which we are going to mock.

To focus strictly on mocking, I have removed non-mockable parts and blocked out sections to be mocked. These include the following

1. Mock calls to Authenticate.

2. Get a mocked signature.

3. Mock the HttpRequest object

4. Get reference of the Stream so that Stream.Write writes to our desired media rather to the original request stream.

5. Create a Fake WebResponse object and marry it with Request.GetResponse

6. Get reference of the response stream that will be filled with data from local resource.

Staring off every mock should have a MockManager.init(). we can further check if it is initialized or not by MockManager.Isinitialized.I have moved the common mock statements to a separate class for LINQ.Flickr which I call FakeFlickrReposity. It takes in the type of repository and the returned object and it can be constructed by a simple using block as it implements IDisposable.

using (FakeFlickrRepository<PhotoRepository, Photo> photoAddMock = 
new FakeFlickrRepository<PhotoRepository, Photo>()) 
{ 
   ... 
   ... 
}

Inside it creates a Mock in its constructor of type PhotoRepository, the method of which(Also, its base) to be mocked.

public FakeFlickrRepository()
{
    _mockRepository = MockManager.Mock<T>(Constructor.NotMocked);
}

The Constructor.NotMocked, means that the initialization codes for PhotoRepository wont be skipped. In this case creating the interface mapping to endpoint, getting keys, paths, etc.Now, going into the test class of LINQ.Flickr for uploading photo, I have first created the Photo object that has stream reference of a file from local resource.

//[Following block used in the full codeview at the bottom]
Stream photoRes = 
GetResourceStream("Linq.Flickr.Test.blank.gif"); 
Photo photo = 
new Photo { Title = "Flickr logo", FileName = "Test.Mock",
File = photoRes, ViewMode = ViewMode.Public };

Next, called the following

photoAddMock.MockAuthenticateCall(true, Permission.Delete);
photoAddMock.MockSignatureCall();

Inside of MockAuthenticateCalls looks like

_mockRepository.
ExpectAndReturn("Authenticate", authToken)
.Args(validate, permission.ToString());

And inside of MockSignatureCall

_mockRepository.ExpectAndReturn("GetSignature", signature);

ExpectAndReturn , as it looks like, traps a method call and returns the result right away rather going to the original flow.

photoAddMock.FakeHttpRequestObject(fileStream);

The above line is for faking HTTPWebRequest and get a stream reference out of it. Stepping in which we can see

_httpRequestMock = MockManager.Mock(typeof(HttpWebRequest)); A 
_httpRequestMock.ExpectSet("ContentType"); B
_httpRequestMock.ExpectAndReturn("GetRequestStream", stream); C

A => Creates a mock of Type HttpWebRequest, B=> Sets an expectation of ContentType set, setting ContentType with mocked request will give a null reference as it depends on internal dictionary to do processing. C=> Sets an expection of GetRequestStream and returns the reference to the stream provided from outside.

photoAddMock.FakeWebResponse_GetResponse();

This will create a MockObject of type WebResponse class and will return a dummy instance of it when HttpRequest.GetResponse will be invoked.

_webResponseMock = MockManager.MockObject<WebResponse>();
_httpRequestMock.ExpectAndReturn("GetResponse", _webResponseMock.Object);

_httpRequestMock is the private Mock variable that we created earlier. We also need to fill up the Response stream with proper Flickr response to be parsed by the LINQ.Flcikr system properly , in case of successful upload. To archive that, we need to marry our local resource stream to the WebResponse.GetResponStream

_webResponseMock.
ExpectAndReturn("GetResponseStream", GetResourceStream(resource));
_webResponseMock.ExpectCall("Close");

Finally, we need to make sure that response stream is closed properly. This is pretty much all which is to be mocked, the rest part of the code is to read the stream where the uploaded content is saved (pointed by us) and compare it with original photo binary.

The part of the code is pasted here for more info of what I just said.

This whole implementation can be found at LINQ.Flickr.Test under PhotoMockTest :: DoPhotoUploadAndDeleteTest, which can be downloaded from www.codeplex.com/linqflickr. Have a nice day!!

LINQ.Flickr 1.3

mehfuzh — Sun, 04 May 2008 19:33:02 GMT

Just released another version of LINQ.Flickr. The release is out with several bug fixes, code optimization, new feature and overall mocking support. I have used Typemock for the unit test of the product. In coming posts, I will show how powerful mock can be in faking routine like upload photo. But, you can dig it right away, if you go by the release page and download a copy of the product. Truly speaking, testing was never fun for serviced API till mock engine is at my hand.

The release is not all about re-factoring and mocking , but now you can query, add , delete photo comment , query people and popular tags and do more that are mentioned in the release page.

Now, doing complex query is even more fun. lets take this.

var query = from photo in _context.Photos
where photo.Id == photoId && photo.PhotoSize == PhotoSize.Medium
select new FlickrPhoto
{
    Id = photo.Id,
    Description = photo.Description,
    Title = photo.Title,
    Url = photo.Url,
    User = photo.User,
    Comments = ((from comment in _context.Photos.Comments
                 where comment.PhotoId == photoId
                 select new PhotoComment
                 {
                     Author = comment.Author,
                     AuthorName = comment.AuthorName,
                     PermaLink = comment.PermaLink,
                     PhotoId = comment.PhotoId,
                     Text = comment.Text,
                 }).ToList<PhotoComment>()),
    Tags = photo.PhotoTags.Select(tag => tag.Title).ToArray<string>()
};

FlickrPhoto newPhoto = query.Single();

The query is about getting the photo info for a specific photo id and I have now combined it with tags, comments to make it more useful. Also, few posts back, I have mentioned about using a RestToCollecitonBuilder to build an object on REST response, it is in action in this release as well.

Finally, don't forget the link and it's www.codeplex.com/linqflickr . In the end, this project is not about querying Flickr and getting photo out of it, but it could be a great learning tool for Mocking, for building custom LINQ provider (with LinqExtender) and other things that you might need to know like, how to define a service endpoint by interface.

Enjoy :-)

Mocking static methods with Typemock

mehfuzh — Sun, 20 Apr 2008 21:37:01 GMT

There are mocking tools like Rhino Mock, Moq, NMock, Typemock and many more. Recently, I was kinda evaluating mocking tools to mock out REST calls in Linq.Flickr. Almost all of the mock tools requires some sort of interface reference to work on. When, to mock out methods like XElement.Load or File.Open is impossible with most of the tools, Typemock is one step ahead of others as it supports mocking of static methods.

Since, all the queries in Linq.Flickr goes through REST and all is tied with somehow with XElement.Load for getting the response in a LINQToXml fashion (I have mentioned already in my earlier posts, how :-)). I wanted to fake out the HTTP layer completely so that sitting in an airplane and with no Internet it is possible to test the product.

Before going to any downloads , lets see how easy is Typemock in this regard.

Now, all starts with a NUnit test class, where I have referenced the Typemock lib and during initialization of the test I faked out XElement.Load method for particular URL request to Flickr. Fragment of the code could be like

[SetUp]
public void Initialize()
{
   ...
   ...
   // initialize mock 
    MockManager.Init();

    string frobUrl = "http://api.flickr.com/services/rest/?       
    method=flickr.auth.getFrob&api_key=xxxx
    &api_sig=cdeb9a73a771d5ea374d014680b33a0e";
    // custom method to get element locally
    XElement element1 = MockElement(frobUrl, "LinqToFlickrTest.GetFrob.xml"); 
    // create the mock object.
    Mock mock1 = MockManager.Mock(typeof(XElement));
    mock1.ExpectAndReturn("Load", element1).When(frobUrl);
   ...
   ...
}

So, I created a mock object of Type XElement and set it up for an URL so that when request comes in, it will return my response instead of looking into the sky for it. Finally, its all plain old test class, with no suspicious code :-)

[Test]
public void Test()
{
    var query = from photo in _context.Photos
                where photo.SearchMode == SearchMode.TagsOnly 
                && photo.SearchText == "microsoft"
                select photo; 

    int count = query.Count(); 
   ...
   ...
}

Additionally, its nice to check if all the mock worked out fine in TearDown by MockManager.Verify

[TearDown]
public void Verify()
{
    MockManager.Verify();
}

That's it , you can download a working sample right here. If you have Typemock and NUnit installed, I have provided a .BAT for running NUnit through TMockRunner, change the paths accordingly to have it work for you.

In the end, it is worth mentioning that currently Mock.When is only supported in Typemock enterprise edition.Therefore, I will also wrap the dateaccess layer of Linq.Flickr with interface reference so that it is possible to mock with others mocking tools as well and I will keep the code updated with latest changes so that you can play around it.

LINQ.Flickr 1.2

mehfuzh — Wed, 27 Feb 2008 18:10:53 GMT

Last week, I have released LINQ.Flickr 1.2 , this new release comes with some bugs fixes requested by community. The best of them was not to be able to search only by user and with specific photo size. The bug started after converting it to use LinqExtender instead of its own query logic. So, now here it is

A complex query for getting 12 most recent photos for a user "neetulee" (my wife's photo stream, need to track what latest she uploads :-))

var query = (from ph in context.Photos
             where ph.User == "neetulee" && ph.PhotoSize == PhotoSize.Square
             orderby PhotoOrder.Date_Posted descending
             select ph).Take(12).Skip(0);

Also, I got request to have different config section for Flickr settings, which looks like

<configSections>
    <section name="flickr"
 type="Linq.Flickr.Configuration.FlickrSettings, Linq.Flickr"/>
  </configSections>

  <flickr apiKey="##Your API Key##" secretKey="##Your Secret Key##"/>

Finally, I have added a NUnit project to test out the API, I will soon come up with a local solution that mocks flickr request, it is really slow and time consuming to test against remote source (esp , when you have to upload, get photos).

And, one thing that I sure forgot to mention the demo_app, that I have created on LINQ.Flickr , it is still work in progress and working on converting it to MVC with some more features that will give a good startup with LINQ.Flickr. I will keep posted when done :-)

Overall, thanks to the community for outstanding support, I hope to have it in coming days.

LINQ.Flickr project URL : www.codeplex.com/linqflickr/

Thanks

REST with LINQ to XML

mehfuzh — Fri, 11 Jan 2008 12:30:32 GMT

With LINQ to XML, what I have learned so far, it's awesome, it is not only the first class concept of processing XML data, but also let you process a complex XML doc in the most simplest and readable way.

I have a project called, Linq.Flickr , and I often need to process XML data for REST query.

To show a simple example of LINQ to XML, lets take a REST response from a Flickr method called flickr.people.getUploadStatus and see how it is processed.

<user id="12037949754@N01" ispro="1">  
<username>Bees</username> 
<bandwidth maxbytes="2147483648" maxkb="2097152" 
usedbytes="383724" usedkb="374" remainingbytes="2147099924" remainingkb="2096777" /> 
<filesize maxbytes="10485760" maxkb="10240" /> 
<sets created="27" remaining="lots" /> 
</user>

Before .net 3.5. it could have been done by GetElementyByTagName("users") - > inside the while loop getting the element, reading value, storing it in private variables , going to next sibling and repeat, if nested , then take the first child and so forth. But , in .net 3.5 using LINQ , the translation is not only just like XML itself, moreover , in XElement.Load , we can directly pass the REST query string.

So, Two, steps to do a REST with LINQ

Build the URL and pass it to XElement.Load
Parse the response and take necessary actions.

For example, for the above XML, I wrote something like below, in PhotoRepository.cs, that does a selective parsing.

try
{

    XElement element = GetElement(##REQUEST URL##);

    People people = (from p in element.Descendants("user")
      select new People
      {
            Id = p.Attribute("id").Value ?? string.Empty,
            IsPro =
            Convert.ToInt32(p.Attribute("ispro").Value) == 0 ? false : true,
            BandWidth =
            (from b in element.Descendants("bandwidth")
               select new BandWidth
                {
                      RemainingKB = 
                      Convert.ToInt32(b.Attribute("remainingkb").Value),
                      UsedKB = Convert.ToInt32(b.Attribute("usedkb").Value)
                 }).Single<BandWidth>()
               }).Single<People>();

    return people;
}
catch (Exception ex)
{
    throw new ApplicationException("Could not process response", ex);
}

Note :GetElement is a local method that does a XElement.Load, with some validation check.

Here my Client-Side object looks like

People
Id
IsPro
BandWidth
RemainingKB
UsedKB

The most interesting thing is, everything is done on the fly , no loop, no intermediate result tracking, no headache of sibling and first child.Overall, the code has a high point in terms of readability.

Take that !!

LinqExtender 1.2 is out now

mehfuzh — Mon, 24 Dec 2007 20:31:25 GMT

Since, the first release of LinqExtender, I found quite a bit download and feedback from community around. I did plenty of changes and tried to make it as simple as possible for creating custom providers, without knowing a bit of reflection and expression parsing of the core framework.

After the release , I was asked by people around , why do we need Linq , when we can do it by method calls, the answer is, Linq gives another level of abstraction to method call that enables you to set a query domain for developers, by means of strongly type query objects, it's not like exposing the data access layer to the front end developer, but it is like giving them a playground with proper boundary. In other words, front end developers now can query on some specific criteria that we set by means of query object , still giving them a flexibility of functional programming.

Now on to the release 1.2. it has come with query info retrieval wrapper and some new features ,which could be useful while making custom providers.

I have mentioned in following post, how query data is delegated to Process routine, that will be overridden in the custom provider that developer is working on.

http://weblogs.asp.net/mehfuzh/archive/2007/12/02/linqextender.aspx

Now with new release it looks something like

protected override void Process(LinqExtender.Interface.IModify<T> items, Bucket bucket)

As , you can see that it has Bucket object, which is nothing but a wrapper for holding the query details. Each Bucket has some BucketItem. BucketItem contains info for each property used in the expression separated by &&.

Typically BucketItem looks like

BucketItem
Name - Property name, different if the used with OriginalFieldNameAttribute, or less it is same as property name.
Value - value in the query , for which the property is compared. Default value, Null.
Unique - True , if UniqueIdentifierAttribute or its inherited type is used on property.Here, one can Use UniqueIdentifierAttribute directly on property or can use any inherited form like, PrimaryKeyAttribute that inherits the UniqueIdentifierattribute, to reflect value to this property.
RelationType : Enum - Equal , LessThan, LessThatEqual, GreaterThan, GreaterThanEqual. Used to identify which type of logical comparison is used.

Any of the property, which is not used in a query , BucketItem.Value and BucketItem.RelationType will have the default value for it, which is Null and Equal respectively.

Now, Going Back to Bucket, it looks like

Bucket
IDictionary<string, BucketItem> Items - List of items for property, where string is the property name of the query object, BuckItem represents how the Property is treated and used in query.
ItemsToTake - default null , if Take is not specified in query.
ItemsToTake - default 0, if Skip is not specified in query.
UniqueItems - string[], contains the name of property on which UniqueIdentifierAttribute or its derivative is applied.

As, we can see from this release that Linqextender supports most common logical expression rather than just Equal expression.

The new release also supports "New Type" queries, which i already mentioned in this post

http://weblogs.asp.net/mehfuzh/archive/2007/12/16/anonymous-type-in-linqextender.aspx

Finally, I have added CTE(Common table expression) generation for OpenLinqToSql (Formerly known as TinyLinqToSql) provider.

Now , queries like the following with Take and Skip

SqlQuery<Book> context = new SqlQuery<Book>();

var query = (from q in _queryContext
             orderby q.LastUpdated ascending
             select q).Take(5).Skip(2);

// this is where the query will execute
foreach(var book in query)
{
 // do something useful 
}

Will generate Sql like...

WITH FilteredList(Id,Author,Title,ISBN,LastUpdated, [RowNumber]) AS(
SELECT Id,Author,Title,ISBN,LastUpdated, Row_number()OVER(ORDER BY 
LastUpdated asc) as [RowNumber] FROM Book 
)Select * from FilteredList WHERE [Rownumber] Between (3) and (7)

Here, Take(5), Skip(2), it will take 5 items starting from 3.

For more, I would suggest to have a look at release page of LinqExtender

OpenLinqToSql provider is made to exercise the LinqExtender engine , it is provided with the LinqExtender source and with NUnit test class in LinqExtender project itself. There is another project named Linq.Flickr, where I have originally started working on with Linq provider and then made LinqExtender, this is currently a separate project. This shows another possible implementation of LinqExtender, for service end points.

Happy Holidays!!!

Anonymous Type in LinqExtender

mehfuzh — Sun, 16 Dec 2007 16:55:18 GMT

It is now possible for LinqExtender implemented providers to have anonymous type in the select query.

For example, consider the following

SqlContext<Book> context = new SqlContext<Book>();

var query = (from q in context
            orderby q.LastUpdated descending
            select new { q.ISBN, q.Title}).Take(1);

var book = query.single();

// do something useful

Console.WriteLine (book.ISBN   + "  " + book.Title);

This sample done using TinyLinqToSql custom provider made on LinqExtender. Here I have some books in database and i want the top 1 , latest book out of it, also I need only two items, ISBN and Title, which I just need to show to in my current scope, without declaring any formal type, in this case the anonymous type can be useful and can be done in the above way.

By the time , I am writing this post , I was having some problem with codeplex , for uploading the latest code of LinqExtender. Hope , it will be done , when you are reading this post.

Also, I have uploaded a new version Linq.Flickr , with latest LinqExtender, so you can have the taste of anonymous type in there as well. Though this is out of scope of the post, but need to say that, now you can get photos with order by Date_Posted/ Date_Taken asc/dsc respectively. Flickr API also supports, other two properties Relevance and Interestingness, but these two only support sort by ascending , therefore , I omitted this half feature, hope they will come with both way order for these two parameters.

No need to say, you can download Linq.Flickr at www.codeplex.com/linqflickr and LinqExtender and TinyLinqToSql at www.codeplex.com/linqextender

Also, I found this cool post of Scott Gutherie for anonymous type, you might need to look at it as well.

http://weblogs.asp.net/scottgu/archive/2007/05/15/new-orcas-language-feature-anonymous-types.aspx

Finally, an anon but cool guy from community named Reski Mills helped me implement this anon type real fast, thanks man!

Enjoy!!