Daniel R.

An Introduction to AIR Development, Security, and Deployment
J. Philip Camp, IBM Interactive - Boston

Moving from Flex to AIR isn't that big of a deal. AIR is as easy as Flex. Coding is the same, just the top level application changes, additional styling options for the chrome.

Use external style sheet to help style the application (could be done by the designer and just included by the developer with an mx:style tag).

How to get rid of the Native OS look and field. Set application chrome to none. All pieces of the Flex chrome are standard Flex components. Those can also be styled using CSS.

Using code behind can further reduce the coupling between the MXML and the ActionScript code. Programmatic setting of UI component properties.

Now we want to add data persistence. With code behind we can add in persistence as needed instead of always using HTTPService to request the data on demand. SQLiteAdmin is simple tool to look at a SQLite DB.

Security:
All apps use the same engine, one app can read another application. Possible to use encrypted database.

Deployment:
Need certificate to sign it (available from most certificate provides) can create temporary certificate. Bundle with AIR Badge to create a nice installer that can be run from the web.

Tags: air flex flexcampboston2008 security

Posted by Daniel Rinehart at 6:00 PM | Permalink | Comments (0)

Building Mashups with Flex and AIR
Oscar Cortes, BrightCove

What is a mashup? Borrowed from music. Could be a dish (with potatoes). Web application that defines data from different sources. Not only about pulling together APIs, the sum should be better than the parts. Like the love song from Moulin Rouge, it combines many to make a more interesting whole.

Mashup sources: database, web services, media, xml, are some of the key ones.

Protocols: REST (64%), Soap (22%), JavaScript (7%), XML-RPC (3%), Atom (2%).

Who: Used to be only flickr, now also enterprises like Google, salesforce.com, and Yahoo. But developers are key player.

Flex maps strongly to APIs and models these services supply. Advantage of web services are that other people are providing data and maintaing it. The barrier to entry is low so you can experiment quickly. Build your own portfolio and try out new stuff.

Typical REST call: URL, API Key, API version, method to call, parameters, maybe digest or checksum. Can also use Web Libraries, JavaScript, and SWC libraries.

Typical result: XML or JSON, CVS or Text, Docs or PDFs, media (growing trend).

Can use native flex classes for REST (HttpService) and Web Services (WebService).

Demo using NYTimes community API (comments by URL). http://developer.nytimes.com/, Ribbit API http://developer.ribbit.com/, Google Maps (http://code.google.com/apis/maps), Google translator (http://code.google.com/apis/ajax/language/), Proxy (simple JSP Proxy)

Translates comment to Spanish. Visualizes locations of where people making the comments are from.

Tools and Techniques: Cairngorm (organized codes and ideas), AS3CoreLib (JSON parsing), E4X (XML parsing).

Durango: Mashup creator available from Adobe Labs.

Tags: air flex flexcampboston2008 mashup

Posted by Daniel Rinehart at 5:58 PM | Permalink | Comments (0)

Merapi
Andrew Powell, Universal Mind

Only a couple people have used it.

Grew out of old Apollo project. Named after volcano on Java. What AIR to talk to Java.

AIR does what it does well, but we want it to do more. How do you extend AIR? Have it talk to GPS. Make mashups that just aren't components but also bring hardware into the mix. Anything that has Java library or JNI will work. Main component is called a Bridge because it is all about moving data back and forth between AIR and Java.

Need to create a connection, could be local or remote. AIR/Flex runs on OS. Bridge runs on OS. Hardware and applications also running on OS. AIR and Bridge are connected via AMF using BlazeDS serialization/deserialization techniques. Bridge then talks to applications and hardware.

var message:Message = new Message();
message.data = "Hello World";
message.type= " Reply";
Bridge.instance.sendMessage(message);

BridgeInstance has result event that you can handle.

Bridge API is easy, complexity is all in external APIs Merapi talks to.

It's alpha so security, reliability, installer, etc. are still being worked on.

merapiproject.net (where to get)
infoaccelerator.net (Andrew's site)

All applications have a Java piece and a Flex piece.

Demo of AIR application controlling bluetooth connected robot. Lego Mindstorm.
Demo of Google translator and text to speech.
Demo of Growl for the Mac. This also works from the browser.

Demo showing data grid in Flex exported to Excel. Data updates in Excel when saved update the data grid. Can create and send email message, update contacts, meetings, etc. If you can do it in Java you can do it with Merapi.

If within the browser, can it be an applet or if it is an application. Right now it needs to be a Java application, possibly a service.

Remote Java objects and competing with BlazeDS. Some overlap, but Merapi is more about hardware connections.

It is all Flex based. Next beta will also include Flash support.

Excel formula values are sent back. Word formatting probably comes back over RTF.

Public beta in the next couple of months.

Is it open source? It is open source, value is in derivative work.

How would the browser and desktop piece work? Still TBD.

Only limit is your imagination. Anything Java can do you can send it back and forth.

Data access size and transfer rate limits are not known, probably limited to hardware.

Tags: air flex flexcampboston2008 java merapi

Posted by Daniel Rinehart at 5:55 PM | Permalink | Comments (0)

Model Driven Development Using Flex Builder and LCDS "Next"
Christophe Coenraets, Adobe

Only three people in audience are using LCDS, but that is part of the problem. Hard to use, hampering adoption.

Showing demo with data grid editing. Refreshing page shows changes were not lost. Two different clients against same data are synchronized. Showing multiple views of the same data. Two different companies and a search results window. Multiple view synchronization. LCDS is all about data management.

Why aren't people using it: Price shouldn't be the issue, it's all too difficult. Not focusing on server.

Currently: must create destinations (XML), create assemblers (Java), create DAO (Java), VDO (Java, AS), keep everything in sync. Don't have code completion, binding is difficult, no service introspection.

Accessing data is first hurdle. Configure server through Flex Builder wizard. Normal server properties (server name, port, context root). Can now explore data exposed by server. New "Adobe Data Model" wizard as part of project. Select server and tables you want to work with. Right now it produces XML but many have GUI later on. Including associations. Deploying data model generates code. Includes base class and subclass generation so that the base class can be regenerated without disturbing your extensions. We didn't build "demo ware" code can be used for simple to complex applications.

Dropped company list that show up as data grid. Dropping detail table in prompts for needed data based on dropped table from data model. Do have to manually write handler to connect the two data grids.

Why a custom data model? Wanted to do more than just describe data structure also wanted to define behaviors. You may have more than one data model.
Manually editing generated model to include a derived property. I.e. full name which is a combination of first and last name with some formatting. Change to data model synchronizes to other generated code.

Adding constraint to data model. Boolean variable showing valid state was added. Constraint also added to server side data model checking. Need to cast the data object in client code in order to get compile time checking that all properties are valid.

Business logic location? Can specify where a validation rule gets run. Constraint automatically would reject edit.

How it happens on the standards can't talk about how it happens yet. Is standards based, currently using Hiberante but that is subject to change.

Do you care how your data is updated in database? Will have hook before persistence but really shouldn't care about how is is saved.

Now have Flex and Spring integration. With remoting have SpringFactory that determines what method to call buts has lots of configuration today. Not really Spring like (connections are too loosely correlated as part is Sping and part is LCDS). New model is all Spring based with LCDS, easier to maintain.

Changes to schema will require refreshing the client's data model.

Tags: flex flexcampboston2008 gumbo lcds

Posted by Daniel Rinehart at 5:49 PM | Permalink | Comments (0)

Flex for ColdFusion Developers
Mike Nimer, Digital Primates

What is Flex, presentation is CF application stack. CF connects to everything. Flex Data Services ship with Cold Fusion (BlazeDS RPC and Messaging wrapped with LCDS' Data Management).

How to connect a Flex application: RPC using HTTP, AMF, RTMP (no server required). Flash remoting requires server side piece like CF that translates protocol to CFC. Flex messaging can push message to all clients through an event gateway.

Need: CF 7.0.2 or 8. CFEclipse as an IDE. Flex Builder IDE. CF plug-ins for Flex Buidler (optional but you really want them) many wizards. Can also have separate LCDS but not needed as it is already part of CF.

Hybrid application, HTML and Flash. Full application, takes over entire page. Desktop application, using AIR with CF server.

Break out of page model and switch to event model. Small self contained components. Application around widget decides what to do with events. Properties in events out (rule of thumb for components).

Only writing CFC no need for CFMs. Binding to data grid the call service.method.lastResult. Can also use bindings if needed.

Any data type in CF can be set back. Can use either array, structs, queries or strongly types entities like User, Products, and other CFCs. CFC instance on server and AS class in Flex. Public only properties. Easy if you get it right. CF case insensitive and not typed. AS is case sensitive and typed. CFProperty used for WSDL generation and Documentation generation. Also used to specify contract between CFC and AS (uses case defined in CFC and property type). CFC also specifies alias (optional but really required for Flex). AS object uses RemoteAlias meta-data. Have to mark a cffunction method with access="remote" to be called by Flex.

CF by default runs as a service. Turn that off and run it from the command line. cfdump is a handy tag and you can see the output in the CF console. Can also turn on Flex logging to see the traffic. Very handy for debugging. ServiceCapture is a network tool or Charles. For a Flex debugging on server, primarily look at body property for requests and responses.

With the CF administrator you can turn on very detailed debugging that is returned to the client. Flex supports browser cookies. Need to specify services config when you compile the Flex application. With server config you can control what the client is allowed to do. Flex can only request CFCs under web root. Flex remoting adapter configuration can change how CFCs and methods are found, secure by default but you can open them up, force certain casing type.

Session and client variables are supposed in Flex. Can't persistent CFC to Flex Session.

Tour de Flex (Released at MAX)

Tags: coldfusion flex flexcampboston2008 lcds

Posted by Daniel Rinehart at 5:53 PM | Permalink | Comments (0)

How to use Flex 3 & Cairngorm with LiveCycle Data Services 2.6
Brian O'Connor, Universal Mind

Material is on his website. Going to cover what it takes to develop with these technologies today, versus the brave new world that the other Adobe folk presented earlier.

Only a couple of people have used LCDS. About half the audience have used Cairngorm. Really looking to remove a lot code that you have to write.

BlazeDS versus LCDS: Data management only in LCDS and has better Service Adapters.

What is data management: Need paging, collaboration, automated CRUD, offline capabilities. Client has data service that connects to destination on server that uses an adapter.

Fill method gets all data from data source and caches it in middle tier and paged to client. Have the ability to control auto commit of changes to the data. Page fill gets only a subset of data at once. Can configure the fill type to use. How you program your adapter to execute it is a hot topic of performance consideration. refreshFill() can be a performance bottleneck. Is determined by the return value of method calls. For example 4000 clients shouldn't all refresh their data at once.

Data grid and data service cooperate to only request new data when needed (i.e. when user scrolls down).

Dispatch event, front controller, service locator, response populates data or view. Get garbage collected which isn't what you want. One class per data service with a manager. Have Singleton for getting access to the method.

Data Service Transactions handle multiple different access methods. Can start transactions on destinations with either commit or rollback after a bunch of changes. Can hookup with JTA. External updates to database aren't reflected to clients. Better to code in middle tier so that it can participate in refreshing clients.

Can also use data services to persist it to AIR SQLite database. Data service has saveToCache method (which is asynchronous). Don't have autoSaveToCache set to true. With a 4 level deep object hierarchy and 4000 rows it takes about 10 seconds to save. Hard to tell when your data is finished loading (fill is problematic). Have to daisy chain clearCache calls when working with multiple data managers. Client sometimes see managed object proxy instead of strongly typed wrappers. need to add properties.

Data manager handles sending back conflict events. Can determine how it gets resolved.

No built in locking support.

Tags: cairngorm flex flexcampboston2008 lcds

Posted by Daniel Rinehart at 5:51 PM | Permalink | Comments (1)

Introducing Flash Catalyst ("Thermo") and Flex Builder Gumbo (Flex 4)
Tim Buntel, Adobe

Overview of the Flash platform.
Design and Develop: Flash CS4 Professional, Flash Catalyst, Flex Builder
Framework: Flex
Clients: AIR, Flash Player and Servers, but not the focus of today's talk

Two different drivers for application, coming at it from the design side versus the data side. Independent of starting point you end up with code.

Focus Areas for the Flash Platform
Design tools focused on: Flash Catalyst, Flash Pro CS4, FXG
Data: Data-Centirc Development
Code: Developer Productivity
Flex Framework: Next-gen components, declarative states and behaviors
Tight integration across teams

"Thermo" introduced at MAX 2007 have been laying the foundation since then, FXG, component model, CS4 FXG support, argue with marketing

Flex 3 had baked in presentation: can only replace individual components, non-boxy designs are hard.
Next-gen components separate presentation from controller: layout almost all controlled by the skin,.

Next-gen: graphics and text as first-class citizens, revised component architecture, declarative states and behaviors

FXG: Graphics format based on MXML, supported in key CS4 applications, just another file format for the CS4 suite, needed a portable notion of states and transitions that could be more declarative.

Flash Catalyst
Why? Harder for one person to do everything design to development. Web applications are getting bigger, "Developer-Designers" are harder to find.
Today: limited roles, designer creates visual design and developers adds interactivity, linear process making it hard to incorporate visual updates, interactivity is hard for designer to add.
Pre-alpha released at Max 2008, public beta early next year

Flex Builder 4
Designer/developer workflow improvements: introduces FXP, launch Flash Professional from Flex Builder
Data centric applications: making visual connectivity easy, end-to-end development with BlazeDS and LiveCycle Data Services, common application templates, code generation for common tasks
Feature improvements: Refactoring, code generation (get/set) debugger, profiler, improved compiler speed, bi-directional text, automated unit testing, network monitor

Demo of Flex Builder 4
Data Centric Application
AMF is now part of the Zend framework, project explorer now has package views instead of folder based,
Data and services tab, new cold fusion IDE called Bolt built on Eclipse, does introspection of the service and builds internal data model, can drag and drop data type into design and generate data grid that can call backend. Can manage a data type and map client side operations like update to the server side calls. New generate event handler from either design view or within code assist. Strongly typed wrapper of data returned can call something like "actorService.comit()", where actor is the manager data type. Network monitor will let you see the traffic between the client and server. Can setup data type to support paging, will call backend as needed. Service also adds support for easy revert of changes.

Flash Catalyst and Flex Builder 4 have pages on labs where you can keep track of the progress of the tools.

Does client side data management work with LCDS? Preview release has some issues that will be fixed by first public.
Network monitor support RTMP? Not yet.
Will real-time protocols be supported? Not implemented at this time, but will expand in the future, no firm timeline. Right now only HTTP and AMF, maybe .NET in the near future.
Flex Builder on Linux? Only a few people raised their hands for using Flex Builder on Linux. Some supporting tools not on Linux yet so the support is lagging. It is a stated goal.
Workflow flow such as Catalyst, Builder, Catalyst. Yes the two projects will work well together. FXP is a way to move between the two with tools to manage it. Difference view for merging FXP projects.
How much data access will be available in Catalyst? Know designer needs data access within Catalyst, sample data available now, trying to figure out the best approach. No live connection but most likely representative data.

Tags: catalyst flex flexcampboston2008 gumbo thermo

Posted by Daniel Rinehart at 5:41 PM | Permalink | Comments (0)

Unit Testing Flex Application with Fluint
Mike Nimer, Digital Primates (presented for Jeff Tapper who was unable to make it)

Testing is like source control. You don't know how much you need until you start using it.

Cold Fusion started out without much testing.

Ever bug has to have a unit test that exercises the bug before fixing it. Regression bugs discovered as part of testing are show stoppers.

Testing methods
Manual testing: humans create and run, low cost to start high cost to maintain, testing happens less often
Automated testing: humans create and computers run, higher cost to develop but lower to run, more often

Testing as part of development
Code until the red goes away
Developers create code and write tests, focus on test driven development
Automated build checkout, build, and test running, various tools to do that

Test types
Unit tests: individual method testing
integration tests: combination of test components

Tools for testing
FlexUnit: Original testing framework, based on JUnit
Flunit: Better asynchronous testing, better UI testing support, and sequences

Integartion testing is hard: Visual Flex Unit does bitmap comparison,
Fluint checks sequences and events

Test methods , test cases, test suites, and test runner. Various types of assertions. Comes with runner and has file watcher to pickup modules and run tests on change.

Asynchronous Testing
Events can occur at any time so you need to handle it sometime later. Uses asyncHandler which is a function that you pass as the event listener. Also want to pass data through to handler. Second argument to event handler. Can have asyncHandler as part of setup step.

UIComponent Testing
TestCase is a UIComponent so it can have components added to it as a child. Still need to what events to listen for.

Sequences
String together many sets and event waiting.

Test meta-data flag
Meta-data is copied over and available in the reports. Also produces XML like file in a JUnit like format.

Test filter and sorting
Only run certain tests, headless test runner

Configuring Fluint and test setup: Writing libraries can have another test application. Flex projects can't link so

Migrating from Flex Unit to Fluint? Best to ask on the forumns.

Mocking data? Nothing tied into Flinut, framework can support it.

Code coverage: using Flex Cover.

AIR test runner: looks for directory changes and runs it.

Tags: flex flexcampboston2008 flexunit fluint testing

Posted by Daniel Rinehart at 5:45 PM | Permalink | Comments (1)