One of the developers on our team recently created a sample Windows Media Center Presentation Layer web application that demonstrates how to utilize a Host object to access data that is created dynamically on a server without requiring the page to reload. This technique can be particularly useful when you want to update some content on a page that contains numerous assets that you do not want to re-download and/or if you want to avoid visible flashing and transitions for page reloads.
There are two components to this sample - the sample UI and the sample data generation file.
Sample UI component
A live version of the sample UI can be found at http://play.mediacentersandbox.com/Sample.DataTransfer.mcml. It contains 2 UI elements: a DataTransfer UI, and the main UI.
DataTransfer UI
The DataTransfer UI is an abstraction layer that encapsulates the functionality of loading new data into an already visible MCML page.
Consumers that want to use this DataTransfer object need to provide the following properties:
- A ResultSet (which is an ArrayListDataSet object) to store the results of the server-side data generation
- A RequestStatus (which is an EditableText object) to store the current status of the data transfer
- A TargetSource (which is a string) to specify the URL where the data should come from
- A RefreshCommand (which is a Command object) that will invoke a data refresh
Main UI
The main UI contains an example of a common usage scenario using the DataTransfer UI. It contains the following elements:
- An instance of the DataTransfer UI
- A button that triggers the DataTransfer object to refresh its data when invoked (this could be easily modified to automatically refresh the data by using a timer instead of a button that the user has to click)
- A Text field to display the status of the data transfer - it is bound to the RequestStatus that is returned by the DataTransfer object
- A Repeater to display the updated data - it is bound to the ResultSet that is returned by the DataTransfer object
Sample data generation file
A live version of the sample data generation file can be found at http://play.mediacentersandbox.com/RandomData.aspx. The source code for it looks like this:
<%@ Page Language="C#" %>
<% Response.ContentType = "text/xml"; %><%Response.Expires=0; %>
<% Random r = new Random(); %>
<Mcml
xmlns="http://schemas.microsoft.com/2006/mcml"
xmlns:cor="assembly://MSCorLib/System"
xmlns:me="Me"
>
<UI Name="Result">
<Properties>
<ArrayListDataSet Name="ResultSet">
<Source>
<cor:String String="Random.Next = <%=r.Next()%>" />
<cor:String String="Random.Next = <%=r.Next()%>" />
<cor:String String="Random.Next = <%=r.Next()%>" />
<cor:String String="Random.Next = <%=r.Next()%>" />
<cor:String String="Random.Next = <%=r.Next()%>" />
<cor:String String="Random.Next = <%=r.Next()%>" />
</Source>
</ArrayListDataSet>
</Properties>
</UI>
</Mcml>
You can try out this example on your Windows Vista Home Premium or Ultimate Edition RC1 or later system by downloading this RegisterMceApp XML file and running RegisterMceApp.exe <path to codeless_datatransfer_example.xml>
When you register this XML file, you will have an entry named Data Transfer Sample in the Program Library. When you launch the sample in Windows Media Center and click the Load New Data button, the ResultSet object will be populated with 6 new random numbers, and since the ResultSet is bound to the repeater on the client UI, the data in the repeater will automatically update each time you click the button without requiring the entire page to refresh. The UI will look like the following:
A couple of additional notes
- Keep in mind that due to the security restrictions in place for Windows Media Center Presentation Layer Web Applications, the UI page and the data generation page must both be hosted on the same web domain for this scenario to work as expected. For this sample, both are hosted on the play.mediacentersandbox.com domain
- This scenario demonstrates a relatively simple dynamic data scenario. For a more involved example of how to dynamically switch hosts, see the sample in McmlSampler named AdvancedMarkup.HostViewItem.mcml
Aaron