ADOBE FLEX 3
Developer Guide
203
Example: A Wiki parser
This simple Wiki text conversion example illustrates a number of uses for regular expressions:
Converting lines of text that match a source Wiki pattern to the appropriate HTML output strings.
Using a regular expression to convert URL patterns to HTML <a> hyperlink tags.
Using a regular expression to convert U.S. dollar strings (such as "$9.95") to euro strings (such as "8.24 €").
To get the application files for this sample, see www.adobe.com/go/learn_programmingAS3samples_flash. The
WikiEditor application files can be found in the folder Samples/WikiEditor. The application consists of the following
files:
Defining the WikiParser class
The WikiParser class includes methods that convert Wiki input text into the equivalent HTML output. This is not a
very robust Wiki conversion application, but it does illustrate some good uses of regular expressions for pattern
matching and string conversion.
The constructor function, along with the
setWikiData() method, simply initializes a sample string of Wiki input
text, as follows:
public function WikiParser()
{
wikiData = setWikiData();
}
When the user clicks the Test button in the sample application, the application invokes the parseWikiString()
method of the WikiParser object. This method calls a number of other methods, which in turn assemble the resulting
HTML string.
public function parseWikiString(wikiString:String):String
{
var result:String = parseBold(wikiString);
result = parseItalic(result);
result = linesToParagraphs(result);
result = parseBullets(result);
return result;
}
Each of the methods calledparseBold(), parseItalic(), linesToParagraphs(), and parseBullets()
uses the
replace() method of the string to replace matching patterns, defined by a regular expression, in order to
transform the input Wiki text into HTML-formatted text.
File Description
WikiEditor.mxml
or
WikiEditor.fla
The main application file in Flash (FLA) or Flex (MXML).
com/example/programmingas3/regExpExamples/WikiParser.as A class that includes methods that use regular expressions
to convert Wiki input text patterns to the equivalent HTML
output.
com/example/programmingas3/regExpExamples/URLParser.as A class that includes methods that use regular expressions
to convert URL strings to HTML
<a> hyperlink tags.
com/example/programmingas3/regExpExamples/CurrencyConverter.as A class that includes methods that use regular expressions
to convert U.S. dollar strings to euro strings.
ADOBE FLEX 3
Developer Guide
204
Converting boldface and italic patterns
The parseBold() method looks for a Wiki boldface text pattern (such as '''foo''') and transforms it into its
HTML equivalent (such as
<b>foo</b>), as follows:
private function parseBold(input:String):String
{
var pattern:RegExp = /'''(.*?)'''/g;
return input.replace(pattern, "<b>$1</b>");
}
Note that the (.?*) portion of the regular expression matches any number of characters (*) between the two
defining
''' patterns. The ? quantifier makes the match nongreedy, so that for a string such as '''aaa''' bbb
'''ccc'''
, the first matched string will be '''aaa''' and not the entire string (which starts and ends with the '''
pattern).
The parentheses in the regular expression define a capturing group, and the
replace() method refers to this group
by using the
$1 code in the replacement string. The g (global) flag in the regular expression ensures that the
replace() method replaces all matches in the string (not simply the first one).
The
parseItalic() method works similarly to the parseBold() method, except that it checks for two apostrophes
(
'') as the delimiter for italic text (not three):
private function parseItalic(input:String):String
{
var pattern:RegExp = /''(.*?)''/g;
return input.replace(pattern, "<i>$1</i>");
}
Converting bullet patterns
As the following example shows, the parseBullet() method looks for the Wiki bullet line pattern (such as * foo)
and transforms it into its HTML equivalent (such as
<li>foo</li>):
private function parseBullets(input:String):String
{
var pattern:RegExp = /^\*(.*)/gm;
return input.replace(pattern, "<li>$1</li>");
}
The ^ symbol at the beginning of the regular expression matches the beginning of a line. The m (multiline) flag in
the regular expression causes the regular expression to match the
^ symbol against the start of a line, not simply the
start of the string.
The
\* pattern matches an asterisk character (the backslash is used to signal a literal asterisk instead of a *
quantifier).
The parentheses in the regular expression define a capturing group, and the
replace() method refers to this group
by using the
$1 code in the replacement string. The g (global) flag in the regular expression ensures that the
replace() method replaces all matches in the string (not simply the first one).
Converting paragraph Wiki patterns
The linesToParagraphs() method converts each line in the input Wiki string to an HTML <p> paragraph tag.
These lines in the method strip out empty lines from the input Wiki string:
var pattern:RegExp = /^$/gm;
var result:String = input.replace(pattern, "");

Get ADOBE® FLEX® 3: PROGRAMMING ACTIONSCRIPT™ 3.0 now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.