Load HTML from XML source – Part I

 Jan, 23 - 2009   1 comment   Uncategorized

I managed to forget TextField.condenseWhite = true!

Now, although that will handle 90% of your XML -> HTML whitespace issues. There are a few scenarios where the hints in this series come in handy:

  • You want more control over XML -> HTML tag handling. For instance you want to avoid an extraneous wrapping tag.
  • The CharacterEntity class is still relevant and useful.
  • You’re using TextField.styleSheet. If you’re not using a stylesheet, you can set the htmlText and then access the html with collapsed whitespace by reading the htmlText property back. If you do use a stylesheet, sniffing TextField.htmlText won’t show collapsed whitespace).
  • We often, pull our dynamic content into Flash via XML. A Lot. As in pretty much exclusively. Sometimes, we’ll have honest-to-goodness information architecture to carve up that data semantically. We end up with a structured tree of simple text nodes. The XML parsing routine figures out how to turn this into a view. Great for all kinds of reasons. But sometimes, we just want to treat a node as a block of HTML and pass it into the htmlText property of a TextField.

    This is unnecessarily hard. Neither XML.toString() nor XML.toXMLString() do what you want for this case. But the following function will:

    private function getHTMLContent (xmlString:String):String
      var html = ""
      var prettyPrint = XML.prettyPrinting
      XML.prettyPrinting = false
      var ignoreWhite = XML.ignoreWhitespace
      XML.ignoreWhitespace = true

      var xml:XML = new XML (xmlString)
      var children = xml.children()

      if (children.length())
        for each (var i in children)
          html += i.toXMLString()
        html += xml

      XML.prettyPrinting = prettyPrint
      XML.ignoreWhitespace = ignoreWhite

      return html

    To use it, pass the XML node containing the HTML, and the function will return the appropriate HTML String. Let’s say your XML looks like:

    <description>Lorem ipsum dolor sit amet, consectetur adipiscing elit.<br /><br />Aliquam in lectus quis nisl lacinia dignissim.
      <li>Proin viverra.</li>
      <li>Phasellus tristique.</li>

    Then, after loading the XML document, you’d do something like:

    var desc = getHTMLContent(myXML.description)
    content_tf.condenseWhite = true
    content_tf.htmlText = desc

    If you skip this step, you’ll end up including the description node (which isn’t what you want) or mangling the mixed-content nature (omitting the br tags or the parent-less “Lorem ipsum” opening sentence or something equally as wrong). The script should also works if your content is a straight-forward text node.

    The prettyPrint and ignoreWhitespace stuff keeps your whitespace from wreaking havok with Flash’s HTML format (which is different from a browser in that it’ll happily add extra newlines when they appear in the source).

    Next time, I’ll incorporate Rob’s entity decoding script since Flash’s built-in entity support is pretty lacking.

    Related articles

     Comments 1 comment

  • jon jon says:

    Mmm. Technically, I guess this does *not* strip additional newlines — it merely keeps the pretty-printing mechanism from adding even *more* additional whitespace. 

    If this was targeted at Flash-only, it wouldn’t be that big a deal — it’s actually pretty nice to be able to format whitespace directly in the XML without CDATA etc. But, we’ll eventually use PHP to read this XML and output HTML pages, so it’s important to anticipate how the browser will behave and try to match that.
    Look for the next update — I’ll include newline stripping there.

  • Leave a Reply

    Your email address will not be published. Fields with * are mandatory.