Is there a library for converting Flash / Flex AS3 TextLayoutFormat data to HTML and CSS?

Question

I have a task to recreate a flexible application in HTML and CSS. In an existing application, TextFlow is widely used to compose content. For several reasons, I need to be reasonably accurate (within a few pixels) with positioning.

The current application is loading data that looks like this:

<p paragraphstartindent="0" textalign="center"><span alignmentbaseline="useDominantBaseline" backgroundalpha="1" backgroundcolor="transparent" baselineshift="0" breakopportunity="auto" cffhinting="horizontalStem" color="0x0" digitcase="default" digitwidth="default" dominantbaseline="auto" fontfamily="ArialCFF" fontlookup="embeddedCFF" fontsize="22" fontstyle="normal" fontweight="bold" kerning="auto" ligaturelevel="common" lineheight="120%" linethrough="false" locale="en" renderingmode="cff" textalpha="1" textdecoration="none" textrotation="auto" trackingleft="0" trackingright="0" typographiccase="default">Here is some content which needs to be accurately positioned</span></p> 

Ideally, I am looking for a library that I can use to translate these many attributes into the "correct" html and css. The current technology stack is PHP on the back panel and javascript in the interface, but there will be no problem using any other language for translation.

Otherwise, I think I will try to write my own using the api link as a guide.

Answer 1

I don’t think there is a lib for this, but if you take a quick look at the docs, it's too hard to translate. Most of the parameters that you can ignore, since they cannot be made in css (without going to css3 - I assume that you want maximum compatibility here), and the rest are pretty simple (color, font, indentation, line height ... )

Answer 2

Wallaby, an Adobe FLA to HTML5 / CSS conversion application, may be useful if you can get it to work with your Flex files ... http://labs.adobe.com/technologies/wallaby/

This, of course, will be the starting point :), but hope this helps.

Answer 3

Unfortunately, you will never get pixel precision in HTML text by design. Font rendering strategies between browsers and even different browser modes (for example: IE9, Safari for Windows) can have different layouts.

Answer 4

You can export your content in HTML using the TextConverter class.

Answer 5

I would go quickly and easily since you only need formatted DOM elements (HTML tags). This [part of Flash Player 9] is somewhat reliable - you can try ...

 source : flashx.textLayout.elements:TextFlow format : String conversionType : String (returnHTML as Object) = flashx.textLayout.conversion.export(source,format,conversionType)