Xml in the WebBrowser? What about easy RSS in the WebBrowser in Whidbey?
A fellow blogger has been talking about hosting the web browsing components of IE as an ActiveX Control. With Whidbey this all goes away and you can now use the Windows Forms 2.0 WebBrowser control. It just drops into place, has a bunch of events for you to handle, includes security model control, and is otherwise the sweetest thing to hit Windows Forms since Halo came out (god how Halo diminished the productivity of such a great team ;-) Anyway, with Halo 2 coming out soon enough don't expect anything better than this to make it into the .NET 2.0 release.
When working with RSS you already have a document of some sort with the loaded source. Since this is .NET 2.0, let's use an XPathDocument since it is fast and can actually be the source for the XsltTransform class when other common XML document classes like the XmlDocument cannot. Once you have the feed loaded in an XPathDocument you can get the item you want to display by using an XPathNavigator object. The first item might be retrieved using:
XPathNavigator item = xPathDoc.SelectSingleNode(”rss/channel/item”);
That is it for the item. The rest of the transformation happens in the XSLT. The first strange thing about the XSLT is that we'll need to include namespaces for all of the namespaced elements in the RSS feed. The only namespaced element I want is the <dc:creator> so I'll add the appropriate namespace for that. You'll also need the XSLT namespace mapping, but not a big deal. Next you specify an output method of HTML. This isn't a big deal, you could just as easily output text or something else.
<xsl:stylesheet version=""1.0""
xmlns:xsl=""http://www.w3.org/1999/XSL/Transform""
xmlns:dc=""http://purl.org/dc/elements/1.1/"">
<xsl:output method=""html"" encoding='ISO-8859-1'/>
The template here will match the root. Remember the root is going to be an <item> element and not the <rss> element. This is because the root of the XPathNavigator is where the transformation is going to begin from. We'll then create a little HTML layout to format our RSS feed values into. A little title bar with the <title> and <description> and then an area where we can put the <description>. The <description> is where things get strange. Remember that it will have been entity encoded by the time it gets to you because you can't have malformed HTML in the document which would in turn become malformed XML and the feed would never load. What you wind up doing is using the disable-output-escaping attribute to prevent the document from being re-entity encoded on the way out. Let me explain how this works:
1. The orignal html is <P></P>
2. Converted into XML this is <P></P>
3. Loaded into an XML document the entities become unescaped again as Text elements <P></P>
4. Finally translated through the XSLT
a) With output escaping <P></P>
b) Without output escaping <P></P>
A lot of people think that you need to use replacements in order to reconstruct the original document, but the XML classes will handle all of this for you if you are careful enough. That finishes up the XSLT:
XPathDocument styleSheet = new XPathDocument();
styleSheet.LoadXml(
@"
<xsl:stylesheet version=""1.0""
xmlns:xsl=""http://www.w3.org/1999/XSL/Transform""
xmlns:dc=""http://purl.org/dc/elements/1.1/"">
<xsl:output method=""html"" encoding='ISO-8859-1'/>
<xsl:template match=""/"">
<body>
<table
border=""0"" width=""100%""
style=""background-color: midnightblue; color: white;"">
<tr>
<td><b><xsl:text>Author:</xsl:text></b></td>
<td><xsl:value-of select=""//item/dc:creator"" /></td>
</tr>
<tr>
<td><b><xsl:text>Title:</xsl:text></b></td>
<td><xsl:value-of select=""//item/title"" /></td>
</tr>
</table>
<div style=""padding-left: 5px; padding-right: 5px;"">
<xsl:value-of
select=""//item/description""
disable-output-escaping=""yes"" />
</div>
</body>
</xsl:template>
</xsl:stylesheet>
" );
The final step is throwing everything into the WebBrowser now fully formatted and customized. By allowing users to mess with the XSLT they can create a personalized experience. Existing RSS aggregators like RSS Bandit allow you to change the transform sheet. In the end, UI's that are skinnable, almost always win. Remember that!
XsltArgumentList argList = new XsltArgumentList();
StringWriter output = new StringWriter();
XslTransform transform = new XslTransform();
transform.Load( styleSheet );
transform.Transform( feedItem.Navigator, argList, output );
this.webBrowser1.DocumentText = output.ToString();
Now, I said you could also choose to do some basic replacements. Since I talked about it I'll throw it your way. You can choose which way you format your own RSS or any other XML formatted document that has escaped entities in one of the text elements.
// Do some basic replacements
string html = feedItem.Description.Replace( "<", "<" );
html = html.Replace( "&rt;", ">" );
html = html.Replace( """, "\"" );
html = html.Replace( "&", "&" );
I think there is an ' that I left out. I'm not too worried about it because I'm sticking with the XSLT way of doing things ;-)