Integrating MVC with Silverlight
Ok, so before I go any farther I want to spell out a couple of things. First, my sample code doesn't have any Silverlight in it yet. Since I didn't have a whole lot of time and beta 2 is only a day or so away I didn't think it was worth the effort. This post is more about figuring out where Silverlight would go rather than actually demoing what it would do. Second, I'm an MVC newbie so there is probably a better way to do what I'm trying to do. However, I've been at TechEd 2008 this week attending MVC and Silverlight sessions and talking to the MS folks and so far haven't seen a good answer.
So with that out of the way, here is what I've been thinking about. I'm trying to understand the best way to integrate Silverlight (or Flash for that matter) into an MVC application. I know that I can just stick the Silverlight html tags into my view and that will work just fine, but if I do that then my Controllers will probably not know about Silverlight and vice-versa. For instance, here is the scenario that I've been thinking about.
Let's say I have a nice looking Silverlight menu bar. Now I could easily add that control to my master page and put links in to all my MVC pages. However, I probably want to do a couple of things: (1) I would like the control to know about where I am at so I can display some kind of context information and (2) I would like the control to get the correct urls from MVC instead of them being hardcoded. Now maybe there is a nice way to do this that I haven't thought about, but instead here is what I came up with (and what is in the sample code at the end of the article).
The way that I made this work is pretty simple, but it still feels a little dirty. I created a second master page that I called Partial that contains nothing but the MainContent content area. This goes in the shared views area next to the Site master page.
<%@ Master Language="C#" ... %>
<asp:ContentPlaceHolder ID="MainContent" runat="server">
</asp:ContentPlaceHolder>
Next, I added a mode parameter of type string to all the actions in my Home controller which I pass as the name of the master page in the View method (using preview 3 here).
public ActionResult About(string mode)
{
ViewData["Title"] = "About Page";
return View("About", mode);
}
Lastly I wrote a little javascript (which uses the asp.net ajax library) to get the contents of the page passing the Partial as the mode and then I stick the results into the content div.
function asyncNav(url) {
url = url + '?mode=Partial';
var request = new Sys.Net.WebRequest();
request.set_url(url);
request.set_httpVerb("GET");
request.add_completed(updateMain);
request.invoke();
}
function updateMain(executor, eventArgs) {
if (executor.get_responseAvailable()) {
$get("content").innerHTML = executor.get_responseData();
}
else {
if (executor.get_timedOut())
alert("Timeout");
else if (executor.get_aborted())
alert("Aborted");
}
}
So now my navigation can accomplish both of my goals because it doesn't unload when the user clicks a link so it has context and it is using urls that comply with MVC. I know, I know, I'm not actually using Silverlight yet, but I think that will be pretty easy to implement and I'm planning on giving it a shot as soon as Beta 2 is released. For now, check out my code and let me know what you think. Am I on the right path or am I missing the boat?
Download Sample Code Here
Update: Just posted Part 2 here which actually uses Silverlight.