UWP Tip #18 - UWP Community Toolkit - Part 15, Markdown Parser

Welcome back to my UWP Community Toolkit series. The previous five tips in the series can be found here:

• Part 10, OrbitView Control
• Part 11, PullToRefreshListView Control
• Part 12, Working with Headings
• Part 13, the Loading… Control
• Part 14, RSS Parser

Intro

As I mentioned in my last post, Part 14, the UWP Community Toolkit includes a pair of helper classes for parsing, one for parsing RSS data and the other for parsing markdown. Let's take a look into the Markdown Parser helper this time.

Markdown Parser

The Markdown parser includes a helper class to take a markdown string, parse it into a Markdown Document and then render that document into your UWP controls with a Markdown Renderer.

(Tip: The toolkit's MarkdownTextBlock also uses the MarkdownDocument and MarkdownRenderer classes. When you use the control, you can use this default renderer or set your own that overrides the MarkdownRendererBase.)

The UWP Community Toolkit Sample App includes this simple example of the Markdown Parser in action.



In this example, you see the raw markdown "This is **Markdown**". That text was parsed into a MarkdownDocument. The document was then serialized to JSON and displayed in a TextBlock. Here is that code from the sample app:

private void UpdateMDResult()

{
     var document = new MarkdownDocument();
     document.Parse(RawMarkdown.Text);
    var json = JsonConvert.SerializeObject(document, Formatting.Indented, new StringEnumConverter());
     MarkdownResult.Text = json;

}

You can see that creating the document is as simple as instantiating a new MarkdownDocument and calling Parse with your raw text. Once you have a MarkdownDocument, you can very easily manipulate it to add, modify or remove individual blocks or elements. The document is essentially a list of markdown blocks. In fact, the sole property you need to be concerned with on MarkdownDocument is Blocks (an IList<MarkdownBlock>).

Objects that derive from MarkdownBlock are MarkdownDocument or one of the following block types:

• CodeBlock
• HeaderBlock
• HorizontalRuleBlock
• LinkReferenceBlock
• ListBlock
• ParagraphBlock
• QuoteBlock
• TableBlock

The purpose of each type is fairly self-explanatory. If you need to manipulate one of these blocks, you would find the target block in the Blocks list and add/remove/modify/replace it, as necessary. Let's take a closer look at the LinkReferenceBlock. This block consists of the following properties to hold the link information:

• Id - A unique string id to identify the reference link.
• Tooltip - The link's tooltip to be displayed when rendered.
• Url - The target.
• Value - The text value to display for the link.
• Type - This is inherited from the MarkdownBlock base and would return the type of this particular block.

I would encourage you to explore the other block types on GitHub if you plan on implementing your own renderer or markdown control.

Wrap-Up

I encourage you to explore the Markdown Parser on MS Docs and GitHub when you have a chance. If you have any ideas to enhance this parser or any part of the toolkit, submit an issue or submit a pull request.

Happy coding!

del.icio.us Tags: uwp community toolkit,markdown,github

UWP Tip #17 - UWP Community Toolkit - Part 14, RSS Parser

Welcome back to my UWP Community Toolkit series. The previous five tips in the series can be found here:

• Part 9, DockPanel Control
• Part 10, OrbitView Control
• Part 11, PullToRefreshListView Control
• Part 12, Working with Headings
• Part 13, the Loading… Control

Intro

The toolkit now includes two helper classes for parsing, one for parsing RSS feed data and the other for parsing markdown. These parsers simplify working with each of these formats. Today we will examine the RSS Parser helper.

RSS Parser

The RSS Parser helper consists of two classes. An RssParser which takes RSS feed data and does the parsing into a list of feed items. The RssParser has a parameterless constructor and a single Parse method which takes the feed data as a string and returns an IEnumerable<RssSchema>.

RssSchema is the other class included with the helper and is the representation of a feed item. The RssSchema has a parameterless constructor and the following properties:

• Author
• Content
• ExtraImageUrl
• FeedUrl
• ImageUrl
• MediaUrl
• PublishDate
• Summary
• Title

If you are familiar with RSS data, these properties should all be familiar. Each is a string type except for PublishDate, which is a DateTime.

I created a simple static helper method which takes a string containing feed data returned from an HttpClient call and returns a list of feed items (RssSchema).

public static IList<RssSchema> ParseRssFeed(string feed)
{
     if (string.IsNullOrWhiteSpace(feed))
     {
         throw new ArgumentException("Feed cannot be empty.", nameof(feed));
     }
     var parser = new RssParser();
     var rssItems = parser.Parse(feed).ToList();

     // Loop to illustrate some of the available properties
     foreach (var item in rssItems)
     {
         Debug.WriteLine($"Title: {item.Title}");
         Debug.WriteLine($"Author: {item.Author}");
         Debug.WriteLine($"Summary: {item.Summary}");
     }
     return rssItems;
}

The foreach loop is unnecessary unless you were actively debugging an issues with a particular feed being parsed. The method could end before the loop with:

return parser.Parse(feed).ToList();

Wrap-Up

There isn't much to explain with this helper. It saves you a bit of parsing and provides a class representation of a feed item. While it is a simple helper, the RSS Parser is particularly interesting to me. I am always looking for ways to leverage RSS data to improve the workflow for creating blog posts for my other blog, the Morning Dew. The UWP companion app for that blog is rather basic and sorely in need of a refresh. Helpers like these provide a little extra motivation to go out and make some progress on Morning Dew UWP vNext.

Go check out the source and give the RSS Parser a try today!

Happy coding!

del.icio.us Tags: uwp community toolkit,rss