<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<fx:Script>
    <![CDATA[
        import mx.controls.Alert;
        protected function button1_clickHandler(event:MouseEvent):void
        {
            Alert.show("Button Clicked");
        }
    ]]>
</fx:Script>
<s:Button label="click me" x="100" y="100" click="button1_clickHandler(event);" />
</s:Application>

Since MXML is a XML based language, this MXML source code needs low level XML parsing in order to derive the MXML language tokens. As I mentioned in the part 1 of this series, the sub compiler interface has a method parse1 with the signature:

public CompilationUnit parse1(Source source, SymbolTable symbolTable)

When this method is invoked in the MXML compiler (MxmlCompiler.java), it invokes parse1 method of Interface Compiler (InterfaceCompiler.java) and this kicks off the lexical analysis and parsing actions for the MXML source. (See: parseMXML method of InterfaceCompiler.java). The parseMXML method creates an instance of MXML Scanner (MxmlScanner.java). This scanner instance performs the low level parsing of XML using the Xercius Java SAX parser library.

The following points may be noted:

1. The SAX parsing method is preferred compared to DOM parsing as it doesn't occupy memory and faster.
2. The complete MXML file is parsed using this SAX parser and a token stream that contains the nodes (sub classed from the token class) is constructed. In most compiler implementations, the parser calls the scanner to fetch a token and the lexical analyzer generates one token at a time based on the lexical rules and the input source code. However in MXML compiler, the approach is to fully parse the low level XML so that the complete source file is converted in to a token stream and kept in a buffer. The scanner simply returns the node (or token) from the buffer when the parser requires it.
3. The high level parser (Parser.java that is auto generated by JavaCC - I will explain this subsequently)  fetches the next token from the token stream already created by the scanner as in step 2 above and constructs a document object representing the syntax tree of MXML source code.

Let us look at the above steps in detail:

The parseMXML method of interface compiler pretty much performs the 3 steps listed above. Once these steps are completed where the syntax tree is built and checked for basic consistency, the interface compiler invokes semantic analysis actions - see SyntaxAnalyzer.java.

Let us look at the following code reproduced from parseMXML method:
in = new BufferedInputStream(source.getInputStream());
flex2.compiler.mxml.dom.MxmlScanner s = new flex2.compiler.mxml.dom.MxmlScanner(in, mxmlConfiguration.enableRuntimeDesignLayers(), processComments );
Parser p = new Parser(s);
MxmlVisitor v = new SyntaxTreeBuilder();
p.setVisitor(v);
app = (DocumentNode) p.parseApplication();

The source code lines 1 and 2 perform the low level XML parsing, steps 3 through 6 perform the language parsing and building the syntax tree.

The Parser class as above is auto generated from a grammar (Grammar.jj) by JavaCC tool. JavaCC produces a top down recursive descent parser based on the grammar specified in Grammar.jj

In the recursive descent parser, there is a method for each non terminal and the parser repeatedly fetches tokens from the scanner using a function: jj_consume_token that gets the token from the scanner using the method: getNextToken( )

The starting point for the parser is the method parseApplication and this method recursively descends through other methods to generate parse actions.

In the next part of this series I will show how the example program (Simple1.mxml) gets parsed by the compiler.

Google App Engine (GAE) is a Cloud Computing platform where a developer can build a cloud application and host it on Google servers. GAE at this point of writing supports Python and Java programming models and offers a set of services.The Getting Started documentation of GAE provides several examples to build a GAE application. However these applications are HTML based and do not provide details of building a Adobe Flex based Rich Internet Application client. Hence my intent in this series of posts is to discuss the details of building a GAE application with Flex as the client application providing a number of examples. In this post let us examine the key concepts behind building a Flex based RIA for Google App Engine.

I will discuss the examples using Python as the backend programming language and will assume Windows XP or Vista client machine.

Let us consider a simple problem as below:

1. In the server side logic we will authenticate a user with Google Accounts
2. Depending on success or failure of authentication we will display a suitable message in the Flex application

To implement the solution to this problem, we will:

1. Develop the server code in Python that performs some function using the Services offered by GAE SDK
2. Develop the client code in MXML using Adobe Flex Builder 3.0
3. Test the application using the localhost server, bundled with GAE SDK
4. On successful local testing, deploy the application (both client side and server side) on GAE
5. Test the final deployed application

As a first step, set up the development environment as below:

1. Obtain a GAE application ID by signing up - see http://code.google.com/appengine/
2. Download the GAE SDK for Python
3. Make sure you already have Python 2.5. If not download from http://python.org/ Since GAE supports Python 2.5, it is better to download the same version though higher versions may be available from http://python.org site
4. Make sure you have the Flex Biulder 3.0 installed in your system. If you do not have one, you can download a trial version from Adobe web site. For students Flex Biulder is free.

Before we begin, it is useful to review how Flex connects to a server application.

The earlier generations of Web applications were server centric. The business logic (in this example, "Authentication") executed on server and in addition to this, the presentation content was also generated in the server. You may review the examples provided under Getting Started section of GAE where this point becomes very obvious.

We may note that the sample code in Google Getting Started documentation has a get method that emits the necessary HTTP headers and also the HTML content for the display. This is in line with typical HTML based applications that often have a page based metaphor than an application metaphor.

Since the Flex applications run on the client and are responsible for handling the presentation, they do not require HTML to be generated from the server. Instead, Flex applications just need the data from the server and they can render the data and manage them on the client. Flex applications interact with the server through well defined, standard SOA model. Broadly, three major protocols are supported:

1. SOAP/WSDL based web services
2. REST based services
3. Remote Object protocol that uses Adobe's AMF binary format

In my next post, I will show how to build the client and server applications for Flex/GAE.

I delivered an invited key note speech at the Service Oriented Engineering and Optimization (SENOPT 08) workshop which was conducted as a part of High Performance Computing (HiPC) conference in Bangalore, India. This talk asserts that over the last 7 years, 2 key trends have emerged: SOA on the services front and Web 2.0 that greatly influences the client side. These two trends are not independent of each other and in fact support one another's adoption. The presentation brings out the synergies and enumerates several Adobe case studies that support this theme. I enjoyed doing this presentation to the research community and am immensely thankful to my colleague, Duane Nickull. He is the senior evangelist at Adobe and also the chair for  the OASIS Service Oriented Architecture Reference Model Technical Committee (SOA-RM TC).

Here are the abridged version of slides

If you want to add this as a widget in your page (iGoogle, etc) you can grab this