Add support for basic HTML in popups

[mstefarov]

• Use a RichTextBox to display TextPopupElement contents
• Strip HTML from popup titles (e.g. as seen in this webmap)

Everything listed here is supported except:

• No audio/video playback yet. The fallback content is displayed instead (typically a link).
• No tooltips yet (the title attribute is ignored).
• Only simple tables are supported (colspan/rowspan/cellpadding/cellspacing/nowrap/width/height/valign attributes are ignored on table elements).
• Customizing element borders is not supported (border attribute and css border properties are ignored).
• Customizing padding and margin is not supported.
• Images with base64 URIs not supported yet.

There are tests (not checked in yet)

---

Examples:

[mstefarov]

The conversion starts with raw popup text, e.g.

<p style='text-align:center;'><img src='https://inaturalist-open-data.s3.amazonaws.com/photos/117365592/medium.jpg?1616692245' alt='Specimen observed' width='250' /></p>
<p><strong>Figure.</strong> Dryobates villosus</p>
<hr />
<p><strong>Hairy Woodpecker</strong> belongs to the <span style='color:;'>Aves taxon</span> and are considered a non-captive/cultivated species within the Ottawa region. This particular specimen was observed on March 24, 2021.</p>

It is converted to a list of HtmlToken objects by HtmlTokenParser, e.g.

    OpenTag(p, "style='text-align:center;'")
    SelfClosingTag(img, "src='https://inaturalist-open-data.s3.amazonaws.com/photos/117365592/medium.jpg?1616692245' alt='Specimen observed' width='250'")
    CloseTag(p, null)
    OpenTag(p, null)
    OpenTag(strong, null)
    PlainText(Figure., null)
    CloseTag(strong, null)
    PlainText( Dryobates villosus, null)
    CloseTag(p, null)
    SelfClosingTag(hr, null)
    OpenTag(p, null)
    OpenTag(strong, null)
    PlainText(Hairy Woodpecker, null)
    CloseTag(strong, null)
    PlainText( belongs to the , null)
    OpenTag(span, "style='color:;'")
    PlainText(Aves taxon, null)
    CloseTag(span, null)
    PlainText( and are considered a non-captive/cultivated species within the Ottawa region. This particular specimen was observed on March 24, 2021., null)
    CloseTag(p, null)

Then tokens are built up into a tree of nodes by HtmlUtility.BuildDocumentTree:

    Document
      Block { align=Center }
        Image { text="https://inaturalist-open-data.s3.amazonaws.com/photos/117365592/medium.jpg?1616692245" }
      Block
        Span { bold=True }
          Text { text="Figure." }
        Text { text=" Dryobates villosus" }
      Divider
      Block
        Span { bold=True }
          Text { text="Hairy Woodpecker" }
        Text { text=" belongs to the " }
        Span
          Text { text="Aves taxon" }
        Text { text=" and are considered a non-captive/cultivated species within the Ottawa region. This particular specimen was observed on March 24, 2021." }

Everything up to this point has been cross-platform, UI-framework-agnostic code. The next and final step is to translate the node tree into WPF elements. This is done by TextPopupElementView. The produced FlowDocument has this structure:

FlowDocument
  Paragraph { TextAlignment = Center }
    InlineUIContainer
      Image
  Paragraph
    Span { FontWeight = Bold }
      Run { Text = "Figure." }
    Run { Text = " Dryobates villosus" }
  BlockUIContainer
    Separator
  Paragraph
    Span { FontWeight = Bold }
      Run { Text = "Hairy Woodpecker" }
    Run { Text = " belongs to the " }
    Span
      Run { Text = "Aves taxon" }
    Run { Text = " and are considered a non-captive/cultivated species within the Ottawa region. This particular specimen was observed on March 24, 2021." }