Delayed Download Prompt in ASP.NET MVC 3

There may be times when it's handy to prompt users to download a file after a slight delay. Such a delay can be useful because it gives users time to review a page's content before they are prompted to save. A good example of this technique can be found on SourceForge whenever a visitor attempts to download a project.

How can this be accomplished using ASP.NET MVC 3? Let's make a small use case to illustrate our goal and then dig into some sample code:

1. Load a "download" page.
2. After a 2 second delay, prompt the user to save a PDF document. (In this case we do not want the browser to use any plugins to render the document).

As per usual, Stack Overflow had a great post to get me started:

$(function() {
 $(window).bind('load', function() { 
  $("div.downloadProject").delay(2000).append(
    ''); 
   });
});

Be sure to include the following in our Html:

This code inserts an iframe into the DOM after a 2 second delay. This iframe is responsible for triggering the prompt to save the PDF. Unfortunately, I could not get this to work in ASP.NET MVC 3 by just referencing the path to the PDF in the source attribute of the iframe. To solve this, I added an action (and associated routing rules) to my Home controller for downloading the PDF as a FileContentResult.

public ActionResult DownloadPDF()
{
 return File("~/FileToDownload.pdf", "application/pdf", "FileToDownload.pdf");           
}

Including the third parameter in the "File" method adds the "Content-Disposition: attachment;" header - this forces the browser to handle the file using the save dialog prompt instead of any browser plugins.

To finish up, we'll revisit the jQuery code we started with and point the iframe to our new action instead of the direct path to the PDF.

$(function() {
 $(window).bind('load', function() { 
  $("div.downloadProject").delay(2000).append(
    ''); 
   });
});

The Token AJAX Post

It's the backbone of the oft heralded "Web 2.0" movement. It's the key to breathing fresh, interactive life into an aging XHTML spec. If you had not already gathered from these clues and the title of my post, I'm referring to AJAX - asynchronous JavaScript and XML.

I'd bet many readers can sympathize with the sense of bedazzlement I experienced upon first laying eyes on Google Maps. Add to that Windows Live, Flickr and GMail, among a host of others, and there is an obvious trend of companies using JavaScript to push their applications to new heights.

With AJAX, interaction between the web server and the client are no longer limited to jagged, intermittent spurts of activity. Instead the bits flow over the wire as soon as they're requested, making for a smoother browsing experience. The best of these AJAX applications have often given me the eerie feeling that I'm not using a browser at all.

But is it just hype? I think the AJAX phenomena has been around long enough to have settled comfortably into the minds of developers and the expectations of users. I don't think it's a passing fad. However, I also tend to believe that the overall usefulness of AJAX has been blown out of proportion. True, it can make for a snappier user interface, but I don't see it as much of a revolution. If anything, I think AJAX was the next evolutionary step beyond the dynamic HTML that was so heavily pushed in the late 90's.

I used the MS AJAX package in a recent project and was pleased to see that this and similar toolkits are opening AJAX techniques to a wider audience of developers. But in my mind I foresee the true next-generation web-based software to transcend traditional XHTML/JavaScript scenarios via new runtimes such as Adobe Apollo and Microsoft Silverlight.

Embedded Video

I was recently asked to enhance a site with some embedded video. The specifications of the project required that the user be able to choose between QuickTime or Windows Media formats for each file.

My goal was to make sure that the media would run properly in Internet Explorer, Firefox and Safari. Most of the tutorials I encountered detailed various basic implementations of "object" and "embed" tags that did not end up meeting my requirements.

Finally, I found a web application from the University of California that automatically generates HTML to easily embed your video format of choice (Windows Media, QuickTime, Real Media, etc) in a cross-browser compatible manner.

Check out the Embedded Media HTML Generator for yourself.