Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

History

  • 1/11/2013 - MXML-based project can now be compiled into a working HTML/JS project
  • 2/10/2013 - Added HTTPService, LazyCollection, and a List class.
  • 3/01/2013 - Added Adobe Flash Builder integration.
  • 4/23/2013 - Updated to use FalconJX instead of FalconJS.
  • 6/27/2013 - Added the beginnings of MXML states and data binding.
  • 7/22/2015 - Updated to latest process.
  • 8/24/2015 - Updated with pre-requisites and automated script info

Set Up

This is the setup for developers working with the source code. If you only want to use Flash Builder to build applications with the FlexJS framework, see: Using FlexJS with Adobe Flash Builder.

...

The steps below have been put into an Ant script that can be run by first installing FlexJS per the instructions in Using FlexJS with Adobe Flash Builder.  Then go to the folder where you installed FlexJS and run "ant".  The script should ask you for a folder to store all of the source code and then download (clone) all of the repos, ask you to approve up to 3 licenses, then build all of the source in the repos (except the source in the FlexJS folder).  Once the script completes, it will tell you to change to the FlexJS source folder and run "ant" again there.  Below is the steps it is performing.  If you are using the script, skip the rest of this section and perform the steps in "After The Build Completes".

 

  1. Get the ASJS code from Apache Git via

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-asjs flex-asjs
    cd flex-asjs
    git checkout develop
    
  2. Get the Falcon code from Apache Git at

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-falcon.git flex-falcon
    cd flex-falcon
    git checkout develop
    
  3. Get the FlexUnit code from Apache Git at

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-flexunit.git flex-flexunit
    cd flex-flexunit
    git checkout develop
    
  4. Get the Flex SDK code from Apache Git at

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-sdk.git flex-sdk
    cd flex-sdk
    git checkout develop
    
  5. Get the TLF code from Apache Git at

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-tlf.git tlf
    cd tlf
    git checkout develop
    
  6. Get the BlazeDS code from Apache Git at

    Code Block
    git clone https://git-wip-us.apache.org/repos/asf/flex-blazeds.git flex-blazeds
    cd flex-blazeds
    
    git checkout develop
  7. In the flex-sdk folder, run 'ant' to build the sdk.
  8. In the flex-falcon folder:
    1. In the compiler folder run 'ant' to build SWF compiler.
    2. In the compiler.jx folder, run 'ant' to build the cross-compiler
  9. In the flex-flexunit folder, run ant to build flexunit.
  10. In the flex-asjs folder, run 'ant' to build the FlexJS libraries.

...

Code Block
+flexlib="/Users/myusername/git/apache/flex/flex-asjs/frameworks" -debug /Users/myusername/git/apache/flex/flex-asjs/examples/flexjs/DataBindingExample/src/DataBindingExample.mxml -js-output-type=FLEXJS

The Demo

MXML->SWF
The latest demo is http://people.apache.org/~aharui/FlexJS/FlexJSStore. Run the bin-release/FlexJSStore.html and right-click and choose "View Source" to see the source. You should be able to compile FlexJSStore.mxml into a working SWF by using the Apache Flex SDK Installer to install a FlexJS release and using the bin/mxmlc on Mac or bin/mxmlc.bat on Windows to compile the source.  This is a port of the old FlexStore demo to FlexJS.  You can click on the Products button, hover over the people and see toolTips, drag them to the compare window and see drag-and-drop work and effects play.

...

Once you have the HTML and JS file(s), you can copy these into the www folder in a Cordova/PhoneGap application and publish it and see it work on a phone or desktop emulator. A To Do item is to automate this process.

Discussion

As you can hopefully see, the first building blocks are now in place such that the ASJS FlexJS framework and FalconJX compiler can create applications using familiar tools, components, and workflows. You can use Adobe Flash Builder or other Flex-capable IDE to quickly build or prototype an application on Flash using structured-programming techniques afforded by ActionScript, then convert it to a HTML/JS application that can run on browsers or mobile devices without Flash.

Next Steps

...