Monday, September 21, 2009

BZLIB/FLEXER 0.1 - FLEX Integration with SHP - Now Available

bzlib/flexer is now available through planet.

As described in the FLEX/SHP posts, bzlib/flexer provides integration between FLEX and SHP, allowing you to do the following:
  1. directly embed flash video files by calling (flash <url;> ...)
  2. directly code in MXML within SHP and compile into flash video  with (mxml ...)
  3. optimizing the compilation of MXML
The package is released under LGPL. 

Prerequisite

You'll need the Adobe Flex SDK 3 downloaded and installed separately, and make sure that the flex compiler mxmlc is on the system path.

You'll also need bzlib/shp, with the planet version >= 1.2. 

Installation & Configuration


Install via planet with

(require (planet bzlib/shp:1:2))
(require (planet bzlib/flexer))

Make sure to require bzlib/flexer in your SHP required script as well:


;; SHP /include/required  
(require (planet bzlib/flexer)) 


Then make sure you create two directories within your $htdocs root to hold the generated mxml as well as the generated flash video:
  • $htdocs/mxml - holds the generated mxml files 
  • $htdocs/flash - holds the generated flash video files 
If you would like to customize the directory paths, you can parameterize mxml-base-path and flash-base-path in your toplevel script:

;; /include/toplevel 
;; the two parameters holds the relative part of the path from $htdocs
(parameterize ((mxml-base-path "/new-xml-base-path")
                      (flash-base-path "/new-flash-base-path"))
   ...) 


Lastly - either make sure you have a not-found that punts to the web-server for file dispatching, or you can place a specific punt script for /flash, so the flash video files can be accessed by the browser.

;; /flash or /include/not-found 
(punt!)


Embed Flash Video

If you drop your ready-made flash video into the $htdocs/flash directory, then you can refer to it via the following in your script:

;; /your-flash-video-shp-script  
(flash "name-of-the-flash-file.swf" #:id "optional-id"
       #:height <optional-height> #:width <optional-width>) 


This comes in handy when you are including external flash video files that are produced separately.  But the power of bzlib/flexer is that you can directly code in mxml.

Flex/MXML Integration

As MXML can be expressed in xexpr, all you need to do is to write the mxml in xexpr form, and wrap those in mxml:

;; /flex-example
(mxml "foo.mxml" 
      `(mx:Script "private function clickHandler(evt:Event):void {
    messageDisplay.text = \"I am Glad, it does.\"; 
}")
      `(mx:Label ((text "Flex without Flex Builder")))
      `(mx:Button ((label "Yes, It Works!") (click "clickHandler(event)")))
      `(mx:Label ((id "messageDisplay"))))
And bzlib/flexer will compile the script into its equivalent mxml file, and place it in $htdocs/mxml/foo.mxml, and then compile it into the equivalent flash video file in $htdocs/flash/foo.mxml.swf and then serve the flash video file to the browser.

mxml takes the following form:

 (mxml <path> #:id <id> #:width <width> #:height <height> xexpr ...)


  • path - required.  This is filename that you wish to store the generated mxml
  • #:id id - optional - if you do not define an id, it will use the path (and convert the path separators into underscores)
  • #:width number - optional - defines the width of the flash video 
  • #:height number - optional - defines the height of the flash video 
  • xexprs - the rest of the parameters should be mxml xexprs or functions that generates them.
The compilation is done only when the source script's timestamp changes to avoid unnecessary (and slow) compilations.

That's it for now - enjoy.

No comments:

Post a Comment

Post a Comment