Main

April 1, 2015

Faking PhantomJS's userAgent in Nightwatch.js

While working on some odd behavior with a PhantomJS driven Nightwatch.js test I had a need to change the userAgent that PhantomJS was reporting. Turns out there is a simple way to do this in the configuration file:

"desiredCapabilities": {
    "browserName": "phantomjs",
    "javascriptEnabled": true,
    "acceptSslCerts": true,
    "phantomjs.page.settings.userAgent": "Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.120 Safari/537.36"
}

I suspect a similar technique can be used for many of the PhantomJS settings.

Tags: nightwatch phantomjs programming testing

June 5, 2013

Jelly no Puzzle Clone

After it was announced that the last company I was working at (Connected Sports Ventures) was winding down, I used some of my free time to clone an amazing puzzle game called Jelly no Puzzle. The original game was Windows only which I didn't have access to. With the help of level walk-thrus on Youtube I was able to see how the game was played. Since starting at Tivli, I'd mostly forgotten about the game. There is lots of polish and code cleanup I could do, but I figured it was best to just release it. If you can play the original please do as it has a lot more polish. To try my clone head to jelly.neophi.com.

Tags: game puzzle

April 17, 2013

Debugging Node.js Applications

Tonight I gave a talk at the Node.js in the wild meetup about Debugging Node.js Applications.

The slides are available at: https://life.neophi.com/danielr/files/DebuggingNodejsApplications.pdf

The sample code used is available at: https://github.com/NeoPhi/debugging

A video of the talk was made and is available at: http://www.youtube.com/watch?v=JNSy1roM82k

Thank you to all that came and the discussion we had.

Tags: nodejs talks

January 9, 2013

Annotated JSHint Configuration File

I've put together an annotated JSHint configuration file. This is mostly just a text formatted cut and paste of the documentation on the website (DRY shudder) in a format suitable for use with node-jshint. I find it handy to have it all in one place when setting up new node projects. You can grab the config from:

https://github.com/NeoPhi/jshint-config/

Tags: javascript jshint nodejs

September 20, 2012

Sharing Code Between Node.js Applications

Last night my colleague Tim Walling and I gave a a talk the Node.js in the wild Meetup on Sharing Code Between Node.js Applications. This was based on our experiences growing a code base to support the backend for RumbleTV Baseball and RumbleTV Football. I've posted the slides with notes. Happy to answer any questions.

Tags: javascript nodejs programming

April 24, 2012

Underscore Mixin for Error Handling

A common pattern that pops up in my node.js programming is this:

// callback is defined elsewhere
object.someAsyncFunction(param1, function(err, response) {
    if (err) {
        return callback(err);
    }
    // do something with response
    callback(undefined, transformedResponse);
});

When I'm really paranoid about ensuring the callback is called I wrap the code in a try/catch:

// callback is defined elsewhere
object.someAsyncFunction(param1, function(err, response) {
    if (err) {
        return callback(err);
    }
    try {
        // do something with response
        callback(undefined, transformedResponse);
    } catch(err) {
        callback(err);
    }
});

Talk about a lot of boilerplate code. Since I use underscore heavily throughout my code I created the following mixin:

_.mixin({
    errTryWrap: function(fn, callback, context) {
        return function() {
            // check for err
            if (arguments[0]) {
                return callback(arguments[0]);
            }
            try {
                // strip the err from the arguments passed down
                return fn.apply(context, _.rest(arguments));
            } catch(err) {
                callback(err);
            }
        };
    }
});

With that in place the paranoid version now becomes:

// callback is defined elsewhere
object.someAsyncFunction(param1, _.errTryWrap(function(response) {
    // do something with response
    callback(undefined, transformedResponse);
}, callback));

Much cleaner. I'm not crazy about the name of the mixin but it makes it easy to find in the code should I come up with a better name later.

Tags: nodejs

April 23, 2012

JSCoverage Report for Jasmine

Wanted to announce the first release of a Jasmine reporter that we've been using in combination with JSCoverage and jasmine-node to capture code coverage metrics and produce an Emma style coverage report. The output of this get consumed by our Jenkins build and gives us nice coverage trends and detailed information for each build. As this is the first public release it is a little rough around the edges but is getting the job done. If anyone wants to check it out you can find it at:

npm install jscoverage-reporter

https://github.com/NeoPhi/jscoverage-reporter

Tags: jasmine jscoverage nodejs

February 9, 2012

An object unlike others: process.env

Yesterday I found myself playing with a configuration hierarchy. Anything set in the environment would override anything defined by a defaults.json file which would override anything hardcoded into the application. My initial attempt led me to discover some interesting things about node's process.env object. Without further ado:

console.log(process.env.hasOwnProperty('PROPERTY_NAME'));

Any guesses what the output will be?

Continue reading "An object unlike others: process.env" »

Tags: javascript nodejs

November 8, 2011

AS3 and Zeo Again

Recently got around to checking a couple of items off of my todo list that had been on there way too long. In summary:

Sometimes the simple things take the longest time.

Tags: as3 csv flex zeo

August 28, 2011

JavaScript: The Good Parts

JavaScript: The Good PartsJavaScript: The Good Parts by Douglas Crockford

My rating: 4 of 5 stars


An appropriately opinionated exploration of JavaScript. The exhaustive diagraming of the language syntax and common methods can be skipped by those who have used the language before. The observations in the chapters on Functions (4), Inheritance (5), Style (9), and lists of gotchas in appendices Awful Parts (A) and Bad Parts (B) make this a must read for anyone developing with JavaScript. The author has a very strong point of view that is presented throughout the book, but I found warranted given the number of ways on can unintentionally harm yourself in JavaScript.



View all my reviews

Tags: books javascript programming

June 2, 2011

Capture an Argument Matcher

More than once I've found myself writing unit test code for a class that internally constructs an object which is then passed along to another method. A common pattern would be to introduce a factory for this internally created object, but at times this feels too heavy weight. I'd still like to make a few assertions about the object but this can get tricky when using lots of mock objects. Enter a little utility class called CaptureArgument. It is a type safe matcher that, wait for it, captures the argument it matched which allows you to inspect it. You can grab a copy of the class at GitHub. Below is a sample usage:

Continue reading "Capture an Argument Matcher" »

Tags: java junit

June 1, 2011

Seven Languages in Seven Weeks

Seven Languages in Seven WeeksSeven Languages in Seven Weeks by Bruce A. Tate

My rating: 3 of 5 stars


This book offers an exploration of various programming paradigms (object oriented, prototype, constraint-logic, and functional), concurrency models (actors, futures, and transactional memory), and programming constructs (list compression, monads, and matching). None of the topics are covered in great detail but for those curious what Ruby, Io, Prolog, Scala, Erlang, Clojure, and Haskell are all about, this book does a reasonable job of introducing and demonstrating each language. The writing is uneven between the chapters and some concepts (like monads and monitors) could use much better code examples. As the introduction emphasizes, to really get the most put of the book, you will want to work through the exercises at the end of each day, as that is the best way to get a feel for each language. Be warned there aren't answers to these problems, despite what the introduction alludes to.



View all my reviews

Tags: books

December 1, 2010

Code Coverage Comparison

Having spent some time using the new ActionScript Code Coverage Plug-in for Flash Builder, I thought I'd compare it to the existing Flexcover tool.

Continue reading "Code Coverage Comparison" »

Tags: as3 flex tools

November 17, 2010

litl Lab (RIA Unleashed: Boston 2010)

litl Lab by Ryan Canulla and Kathryn Rotondo

Not nearly enough hands on coding, especially since half of the session was devoted to their upcoming set-top box product but for which they didn't have a hardware demo.

Flash based SDK for developing channels. Each channel has three views: card (menu with optional slideshow), focus (mouse, keyboard support), and channel view (passive view, swipe type gestures only).

Continue reading "litl Lab (RIA Unleashed: Boston 2010)" »

Tags: api as3 flex litl riaunleashedboston2010

Real Component Development on the Flex 4 Architecture (RIA Unleashed: Boston 2010)

Real Component Development on the Flex 4 Architecture by Michael Labriola

This was a hands on lab so these notes just capture general concepts discussed.

Think of Flex 4 components as the atoms of the system.


  • highly reusable

  • no external dependencies

  • everything is passed into them

  • participate in Flex lifecycle (defined by UIComponent)

  • know how big they are and should lay out nicely


Continue reading "Real Component Development on the Flex 4 Architecture (RIA Unleashed: Boston 2010)" »

Tags: flex riaunleashedboston2010 skinning

Beyond IoC: Advanced Experiments with Swiz (RIA Unleashed: Boston 2010)

Beyond IoC: Advanced Experiments with Swiz by Ben Clinkinbeard

Swiz is all about custom meta-data parsing as returned from describeType(). Recent changes have exposed that meta-data processing to anyone. General switch from autowire to inject.

Continue reading "Beyond IoC: Advanced Experiments with Swiz (RIA Unleashed: Boston 2010)" »

Tags: as3 flex riaunleashedboston2010 swiz

November 16, 2010

How to Launch a Small Software Project (RIA Unleashed: Boston 2010)

How to Launch a Small Software Product by Jesse Warden

Why do it?


  • You might want to change the world, do good, and make money.

  • Think about it as the next stage of your software career.

Continue reading "How to Launch a Small Software Project (RIA Unleashed: Boston 2010)" »

Tags: life riaunleashedboston2010 software

November 14, 2010

ColdFusion, Solr, and Killer Robots (RIA Unleashed: Boston 2010)

ColdFusion, Solr, and Killer Robots by Raymond Camden

Solr gives us better searching and file and data indexing versus SQL.

Continue reading "ColdFusion, Solr, and Killer Robots (RIA Unleashed: Boston 2010)" »

Tags: riaunleashedboston2010 solr

Adding 3D to Your Arsenal (RIA Unleashed: Boston 2010)

Adding 3D to Your Arsenal by Charlie Schulze

Can find a bunch of information on his blog at papervision2.com. Working on redoing site with Away3D examples as almost everything is Papervision3D focused at this point.

Talk is more about how to add 3D to your application than how to do 3D modeling.

Continue reading "Adding 3D to Your Arsenal (RIA Unleashed: Boston 2010)" »

Tags: 3d api flash riaunleashedboston2010

Keynote (RIA Unleashed: Boston 2010)

Keynote by Ryan Stewart and Terry Ryan

Flash has seen a rise in competition: Silverlight, Java FX, JS/HTML

Flash adoption is getting faster. To get penetration from 0 - 80%


  • Flash Player 8 = 12 months

  • Flash Player 9 = 11 months

  • Flash Player 10 = 6 months

  • Flash Player 10.1 = 74% in 3 months


Continue reading "Keynote (RIA Unleashed: Boston 2010)" »

Tags: adobe flash flex riaunleashedboston2010

October 26, 2010

Generic AS3 CSV Parser

As part of my work on the Zeo Data Explorer I found myself in need of a generic CSV parser that could handle quoted text, escaped commas, etc. While I found a few solutions none solved the problem completely or correctly. To that end I wrote a pure AS3 implementation of RFC 4180 (Common Format and MIME Type for Comma-Separated Values (CSV) Files) specification.

It does require Flash Player 10 as I really dig Vectors. I haven't done optimization of it as the speed was good enough for my purposes. For the time being this code is bundled into the Zeo Data Explorer project, but the files can be easily found in the parser package. If you have any suggestions or bugs leave a comment below.

Tags: as3 csv

Initial Zeo Data Explorer Released

I'm pleased to announce the first release of Zeo Data Explorer. For anyone that uses a Zeo to track their sleep, I've been playing with different ways to visual my sleep data, which some of you may have heard me talk about at BarCamp Boston 5. To that end I put together a generic library for parsing the CSV file you can export from the myZeo site. Along with the generic parsing library I've started exploring different ways to visual my sleep, beyond what you can do on myZeo, in an application called the Zeo Data Display. All of the source code is available on bitbucket at Zeo Data Explorer. This includes a pure AS3 library for parsing the data and a sample Flex application for visualizing it. For those that don't have a Zeo I've included a sample of my own data to get an idea of what it tracks. As time permits I hope to add additional visualizations to the tool now that the overall framework is in place. Enjoy and let me know what you think.

Tags: as3 flex zeo

September 21, 2010

Sanitize String for Regular Expression

I recently came across a need to use a user supplied input in a regular expression. To prevent any special characters in the user's string from being treated as a regular expression control character I stumbled upon this solution. Alas I can't remember where I found it but wanted to share.

/**
* Convert a random string into a format that will make sure it doesn't
* impact a regular expression when inserted into it.
* @param string String to sanitize.
* @return Sanitized string
*/
public function sanitizeForRegExp(string:String):String
{
    if (string == null)
    {
        return null;
    }
    return string.replace(new RegExp("([{}\(\)\^$&.\*\?\/\+\|\[\\\\]|\]|\-)","g"), "\\$1");
}

Tags: as3 flex regexp

September 5, 2010

Being Geek

Being GeekBeing Geek by Michael Lopp

My rating: 5 of 5 stars


This book contains many astute observations about the life of a software developer combined with practical advice about how to approach your career. The book touches on aspects like interviewing for a job, office politics, transitioning to new responsibilities like becoming a manager, how to manage your time, dealing with crises, and thinking about when it's time to find a new job. I found the book did a great job of helping me think about the three questions it lays out at the beginning: What am I doing?, What do I do?, and What matters to me?.



View all my reviews

Continue reading "Being Geek" »

Tags: books life

September 2, 2010

Urban Warfare Game

A former co-worker of mine just announced an awesome new Facebook game that they built with Flex, Swiz, and AS3Signals. It's called Urban Warfare, plays like Civilization, and can be found at http://apps.facebook.com/urbanwarfaregame/.

Tags: flex game

August 22, 2010

HTML5 for Web Designers

This isn't the technical book I'm reading as part of my 20x2x20 experiment, instead it was one kicking around the office. By far the best introduction to HTML5 I've come across yet.

HTML5 For Web DesignersHTML5 For Web Designers by Jeremy Keith

My rating: 5 of 5 stars


Great introduction to what HTML5 is and how to start using it today. Having heard the term HTML5 tossed around a lot over the past year this book finally presented it in a concise and useful format. This isn't a technical deep dive but instead clearly outlines what HTML5 adds and provides plenty of links to find out more. Definitely spend the hour a quick read through requires.



View all my reviews

Tags: books html5

May 10, 2010

Static Const of the reference not the content

In the middle of helping a co-worker debug a unit test, we had a test method that ran fine by itself but failed when run with the rest of the tests in the same class. Looking over the code there was no obvious reasons why when both test methods were run the second one failed.

Turned out to be a duh moment. At the top of the unit test there were a bunch of XML fragments declared with private static const. Problem was one of the two test methods was modifying the children of the XML. XML is a complex Object, unlike an int or a String, so the constant keyword doesn't prevent changes to the structure within the XML, it just prevents the reference from changing. A couple of simple fixes:

  1. Make the XML fragments be class instance variables, since each unit test creates a new instance of the test class
  2. Before using the XML use its xml.copy() function

Tags: e4x flex testing xml

FLA version reporting?

With the release of Flash CS5 we have an issue that some files we distribute to customers need to be saved as Flash CS4 compatible. I'm looking for a cross-platform utility that I can easily call from Ant that will report the Flash version that an FLA file was saved as. The goal being to add a source control hook that prevents an FLA in the wrong version from being checked in. Anyone know of such a tool?

Tags: fla flash tool version

April 18, 2010

BarCamp Boston 5

Had a blast at BarCamp Boston 5. Learned about some new technologies and topics that I'd love to play with and learn more about. Some of my favorites Cooking for Geeks, OpenFrameworks, Wolfram Alpha, and Introduction to jQuery.

I threw some slides together and gave a talk about Agile Programming Methods since there looked to be a bunch of interest. Kind of hard to compress everything cool about agile into 25 minutes, but hopefully I got a couple of points across.

What I was more excited to talk about was my continued sleep tracking with Zeo. I'm not quite ready to release a version of the software (still in prototype phase) but I've got an updated set of slides and screenshots. Thanks to those that attended and gave great suggestions on data that I could pull in and plot against.

Tags: barcamp boston flex graph sleep zeo

March 14, 2010

Ideas for Adobe Flash Platform

Got an idea for an Adobe product in the Flash Platform that isn't quite a bug? View and rate ideas at: http://ideas.adobe.com/.

Tags: adobe ideas

February 20, 2010

PKIX path building failed

Recently this error message started showing up in one of our log files and needless to say was causing a few issues:

[org.apache.commons.httpclient.HttpMethodDirector] -

Turns out the process had been running long enough that while trying to perform an HTTPS based operation the certificate in the JVM for the certificate authority the target site was using had expired. A quick update of the cacerts file and everything was happy again. Yet another software rot angle to keep in mind.

Tags: https java jvm ssl

December 24, 2009

AASFSHNR Kiva Team Statistics

For most of this year I've been collecting frequent data snapshots of the Atheists, Agnostics, Skeptics, Freethinkers, Secular Humanists and the Non-Religious Kiva Team. I've been a member of Kiva for some time and thought it would be neat to track the success of the group leading up to our one million dollar goal. A few months ago I started playing with the Flex Charting Components to see what I could do with the data I'd been collecting. I don't have the graphical touch (as anyone who has looked at this website can attest to) but working with the charting components made it easy to throw together some basic visualizations of the data.

The code for the application is ugly, so unlike most of my other sample applications, I didn't view source enable it. Given the plethora of other sites talking about the same material this isn't a loss, trust me :) One thing that I'd like to experiment with is other ways to visual the data. Any recommendations are welcome.

Tags: charting flex kiva

October 24, 2009

Tangent City

I blame Dave for wasting most of my day... He sent out a message saying that the URL of his site had changed. As part of that the URLs for his RSS feeds changed. I'm currently using Google Reader and wanted to update the feed URLs. I'm on a Mac and use Safari for my browsing needs. By default in Safari when you click on a link that is a feed it opens in Safari's RSS reader, not what I wanted. Off to investigate other options.

Continue reading "Tangent City" »

Tags: code hack mac

July 5, 2009

Image Rotation with Pixel Bender

Unlike my previous experiments with Pixel Bender, today I set out to implement a basic image manipulation routine, image rotation. While Flash natively provides the ability to rotate a DisplayObject that doesn't help if you want to combine multiple Pixel Bender filters that should use the rotated image as the source image. Turns out rotating an image in Pixel Bender was a little harder than I thought, but I ended up with a nice solution.

Continue reading "Image Rotation with Pixel Bender" »

Tags: flex graphics image pixelbender

May 12, 2009

Be wary of micro-benchmarks baring speed improvements

I've seen some links recently to the Round up of ActionScript 3.0 and Flex optimization techniques and practices and I'm afraid. I'm afraid that entries on that list are going to become gospel and code that doesn't use the tricks listed will be labeled bad. Knuth said it best, "We should forget about small efficiencies say about 97% of the time: premature optimization is the root of all evil." While the author frames the discussion correctly stating "You have to learn when to use some techniques and when to leave some out." I don't think he does enough to call out the type of optimization each entry is, or more importantly, how these techniques were derived.

Continue reading "Be wary of micro-benchmarks baring speed improvements" »

Tags: flash flex performance

March 24, 2009

HP SWF Decompiling and Security Analysis Tool

HP has released a tool called SWF Scan for decompiling and looking at SWFs for security issues. Available from http://www.hp.com/go/swfscan.

Tags: flex swf tools

March 16, 2009

SimpleDateFormat is not thread safe

It has always felt counter intuitive that there are classes which are not thread safe in the Sun JDK, but that is the case. One that I frequently see people trip up on is SimpleDateFormat. From the documentation:

Date formats are not synchronized. It is recommended to create separate format instances for each thread. If multiple threads access a format concurrently, it must be synchronized externally.

Continue reading "SimpleDateFormat is not thread safe" »

Tags: date java spring

Velocity and Spring Web MVC

The combination of Spring Web MVC with Velocity makes for easy view handling. One of the things that I'm confused about though is getting the configuration up an running. I've been very happy with this configuration so I thought I'd share it.

Continue reading "Velocity and Spring Web MVC" »

Tags: configuration java spring velocity

JUnit, Jetty, HtmlUnit, and Automated Testing

I'm a firm believer in automated testing. The more testing you can automate the less work you need to do to be sure you didn't break stuff each time you make a change. While most people think of unit testing when talking about automated testing, the higher up the interaction chain you can go while not making your tests brittle the better off you will be. On my current project unit test coverage is great, but given that ultimately all of the services get exposed as a web application, being able to automate testing at that level would be beneficial. Below is the approach I took to automate testing our web application.

Continue reading "JUnit, Jetty, HtmlUnit, and Automated Testing" »

Tags: htmlunit java jetty junit testing

March 11, 2009

Building Muscular Graphical Editors in Flex (BFUG March 2009)

Joe Berkovitz is speaking about Building Muscular Graphical Editors in Flex.

Focus on how people build and edit visual documents. Amazed at the problems that come up building visual editors like that.

Continue reading "Building Muscular Graphical Editors in Flex (BFUG March 2009)" »

Tags: flex framework moccasin

January 31, 2009

Server Side Sojourn

I'll been a little quite on the blogging front as of late, besides the occasional user group post. The main reason for that has been the last couple of months I've been heads down doing server side Java development for a cloud computing infrastructure using Amazon's Web Services for S3, EC2, SimpleDB, and CloudFront. All that is the back end for some amazing Flex based applications that Allurent has in the works.

Continue reading "Server Side Sojourn" »

Tags: aws eclipse flex ide java tdd

January 13, 2009

Flex Automation Framework (BFUG Jan 2009)

Eric Hilfer from Tom Synder Productions is speaking about Flex Automation Framework and automated testing.

Continue reading "Flex Automation Framework (BFUG Jan 2009)" »

Tags: automation flex testing ui

December 12, 2008

An Introduction to AIR Development, Security, and Deployment (Flex Camp Boston 2008)

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

Building Mashups with Flex and AIR (Flex Camp Boston 2008)

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

Merapi (Flex Camp Boston 2008)

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

Flex for ColdFusion Developers (Flex Camp Boston 2008)

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

How to use Flex 3 & Cairngorm with LiveCycle Data Services 2.6 (Flex Camp Boston 2008)

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

Model Driven Development Using Flex Builder and LCDS "Next" (Flex Camp Boston 2008)

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

Unit Testing Flex Application with Fluint (Flex Camp Boston 2008)

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

Keynote: Flex 4 Preview (Flex Camp Boston 2008)

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

November 17, 2008

Sorting out Pixels or How I Didn't Plan to Spend My Sunday

I wasted, well maybe wasted is too strong of a word. I used way more time than I should have on Sunday playing with Pixel Bender trying to figure out how to make it sort values. In my trend to make Pixel Bender do stuff besides manipulate pixels I thought a fun mental exercise would be to implement a parallel sort. Now I've not come up with any good use for this yet, considered if this is the best performing parallel sort, yadda, yadda, but it works, which is what I really wanted to get out of this experiment.

Continue reading "Sorting out Pixels or How I Didn't Plan to Spend My Sunday" »

Tags: flex pixelbender sort

November 11, 2008

Architecting a Shared Codebase from Browser and Desktop

Architecting a Shared Codebase from Browser and Desktop
By David Coletta

Maybe more hacking than Architecting. First time giving the talk so all feedback is welcome.

Goal: Build a browser application and an AIR application from a single shared codebase.

Continue reading "Architecting a Shared Codebase from Browser and Desktop" »

Tags: air architecture flex

October 14, 2008

Using Flex & Cairngorm with LCDS Data Management

Using Flex & Cairngorm with LCDS Data Management from Brian O'Connor, Principal Architect at Universal Mind.
Will focus on Flex 3.0 &LCDS 2.6 and post the slides and sample code on his blog.

Previously with Macromedia consulting and Adobe consulting. Some of the audience have used Cairngorm and a few have used LCDS.

Really looking at Data Management as the focus since it has a lot of power. Lots of problems with how best to model data management and data services this type of application.

Continue reading "Using Flex & Cairngorm with LCDS Data Management" »

Tags: cairngorm flex lcds

October 8, 2008

Antennae 1.2.2 Released

Antennae 1.2.2 has been released. This is a very minor update that just changed the bundled version of FlexUnit. I'm now bundling the version from the Adobe Open Source Site. I've also created a discussion group for Antennae available at http://groups.google.com/group/antennae-discussion.

Tags: ant antennae flex

October 6, 2008

PPE 2: Java Project Skeleton

GameOfLifeServer

I've been following the progression of the tool AppFuse for some time now but haven't had a chance to use it. This seems like a prime time (cue learning curve for first new technology). While there are many Java frameworks I could use, I've found the Spring Framework to be rock solid and know that it covers everything I could want to do with this simple application. Spring has also created Spring Web MVC to support the front-end pieces. I think it offers a cleaner solution than Struts. AppFuse supports Spring Web MVC based projects so that should make this straight forward.

Continue reading "PPE 2: Java Project Skeleton" »

Tags: gameoflife java ppe

October 5, 2008

PPE 1: Flex Project Skeleton

The most tedious part of any project I find is getting the skeleton setup. Thankfully Flex Builder's project wizards make this easier. I'll be creating two Flex projects, one called GameOfLife, which will hold the UI application, and one called GameOfLifeTest, which will hold the testing code. Additionally I'll create a Java project called GameOfLifeServer which will hold the back-end code. Both the production and test code will reside in the same Java project since you can easily mix them in Eclipse's Java mode, unlike with Flex. These will all be sibling projects in a top level directory.

Continue reading "PPE 1: Flex Project Skeleton" »

Tags: flex gameoflife ppe

Programming Project Experiment (PPE)

I've been toying with the idea of building a site around the game of life simulator. In the spirit of just playing, I figured I'd blog about my process and thinking to see where it goes while keeping a record of it. With that broad mandate some rough idea of what I could see happening along the way.

Continue reading "Programming Project Experiment (PPE)" »

Tags: ppe

October 2, 2008

Amazon Web Services (AWS) for ActionScript 3, Flex, or AIR

As I've been toying with some new application ideas I've been curious what the current state of Amazon Web Service (AWS) support for ActionScript 3, Flex, or AIR is. Most of the sample code I've found so far is for Ruby, PHP, or Java, basically languages that have a rich server side presence. The lack of AS3 libraries makes some sense given security issues with running code on the client and its need to access your AWS secret key to create valid requests. However, management applications or user based services (i.e. the user must sign up for an AWS account) that could hold the keys for a session or store securely for AIR applications would benefit from such an interface. Below are the libraries that I've been able to find so far, if there are additional resources out there I'd love to hear about them.

Given the lack of cross domain files for certain AWS services, the lack of ActionScript only APIs kind of makes sense.

Continue reading "Amazon Web Services (AWS) for ActionScript 3, Flex, or AIR" »

September 15, 2008

Pixel Bender and Conway's Game of Life

When I started reading about Pixel Bender and realized at its core it was a cellular automaton engine I immediately thought of Conway's Game of Life. I started looking into how to use Pixel Bender to render generations in the game of life.

Continue reading "Pixel Bender and Conway's Game of Life" »

Tags: flex gameoflife pixelbender

September 9, 2008

Making Applications With Degrafa and ObjectHandles

Marc Hughes spoke at the Boston Flex User Group on Making Applications With Degrafa and ObjectHandles.

All of the talk materials are available on his blog.

Continue reading "Making Applications With Degrafa and ObjectHandles" »

Tags: degrafa flex objecthandles

August 27, 2008

New Event Testing Framework in FlexUnit

Part of the new FlexUnit release is a new TestCase subclass called EventfulTestCase. It provides convenience methods for testing objects that emit events. This new class can streamline your testing code and help catch unexpected events. Below is some sample code that demonstrates this new framework.

Continue reading "New Event Testing Framework in FlexUnit" »

Tags: as3 events flexunit

August 22, 2008

Allurent is moving and mannequin suggestions

On Monday Allurent will be in a new larger office. We are moving to 222 Third Street,
Cambridge, MA 02142, which is in the American Twine Building. Our phone number is changing to 617-374-8800.

[Update: I've posted some pictures of our new digs.]

A different office decor is being designed, so there was a raffle for those interested to pick up any of the old Allurent office decorations. Since most of our initial clients were apparel focused, we had mannequins in the office to give it a retail theme. I won the female mannequin and after an adventurous ride bringing it home on my bicycle (pictures coming soon) I'm trying to figure out what to do with it. It's a reclined model mannequin which makes it a little harder so all suggestions are welcome. A picture of the mannequin is below.

Continue reading "Allurent is moving and mannequin suggestions" »

Tags: allurent mannequin

August 21, 2008

New FlexUnit UI

The newest version of FlexUnit released on Adobe's Open Source site includes a spiffy new UI. It's much easier to see what test failed, where, and why. It also includes a feature to help identify tests that don't make any assertions! Below are a couple of screen shots showing the new UI in action.

Continue reading "New FlexUnit UI" »

Tags: flexunit

FlexUnit Moved to Adobe's Open Source Site

Adobe has decided to move FlexUnit to their Open Source site. You can now download and find FlexUnit at http://opensource.adobe.com/wiki/display/flexunit/Flexunit. As part of this move, they have also released a new version. The change history is a little sparse so if I find anything of note I'll write up a post.

Tags: flexunit

August 20, 2008

Odd addAsync() behavior when handling asynchronous events

There is some subtle behavior in FlexUnit's addAsync() that can lead to false positives and false negatives. In each case code that one expects to be called fails to run, which means that your tests may not be covering everything that you hoped they would. To kick off this discussion I'll present some code that should fail, but doesn't.

Continue reading "Odd addAsync() behavior when handling asynchronous events" »

Tags: addasync asynchronous flexunit

August 12, 2008

Patching iTerm

When I went searching for different terminal application for the Mac I found iTerm and have been very happy with it. It offers enough preferences to suit customization to my taste and it offers I couple of features I fell in love with from SecureCRT. In particular it offers a right-click open in browser option. I'm a luddite when it comes to working with email and prefer to use procmail, SpamAssassin, and Pine versus any of the various other email clients.

The problem with text only email is HTTP links that span multiple lines or get formatted with line breaks and spaces. Highlighting such a link and trying to launch it with the iTerm browser hook does nothing. I decided to "fix" this and as such created a small patch to iTerm Build 0.9.5.0611 that removes all white space from the highlighted text before handing it off to the browser. It seems to be working! Prior to this I've done no Objective-C programming so for all I know I've created a big memory leak. For anyone interested rough notes on what I did are below.

Continue reading "Patching iTerm" »

Tags: iterm mac

August 7, 2008

Tomcat, Spring Web MVC, and Exceptions

I've been doing some server side development lately and using Spring 2.5.5 with Tomcat 6.0.18. One of the features built in is intelligent exception handling through implementations of HandlerExceptionResolver. In particular there is easy support to "fix" the HTTP response code for errors to be 200 so that Flash doesn't croak. I got my configuration setup but no matter what I did I kept getting back the default Tomcat 500 error page. A little code tracing showed that my configuration was valid and my Velocity based error page was getting picked up and processed but not reflected in the response. Turns out that Spring 2.5.5 and Tomcat 6.0.18 (and earlier versions) don't play well together. A bug has been logged against Spring so that if it generates an error response it clears out the Servlet error request attributes that Tomcat examines to determine if it should return its own built in error page. Alas as of today you'll have to grab a nightly snapshot of Spring to pickup the fix or manually patch DispatcherServlet.java.

Tags: exception java spring tomcat

July 30, 2008

Advanced CSS Techniques and Programmatic Skinning

At the start of this month I attended the Boston Flex User Group Meeting where TR Coffey, Design Lead at Allurent (where I also work) gave a talk about Advanced CSS Techniques and Programmatic Skinning. Below are some rough notes I took during his talk.


Continue reading "Advanced CSS Techniques and Programmatic Skinning" »

Tags: css flex styling

May 16, 2008

Adobe's David Coletta on Buzzword's Automated Testing Framework

This past Tuesday the Boston Flex User Group held its second meeting. David Coletta from Adobe's Buzzword team spoke about Automated Testing Framework. This was a deeper dive into the topic he presented at Flex Camp Boston 2007. I counted about 50 people at the meeting. It was a very interactive session with a bunch of good questions coming from the audience. Below are my rough notes from the presentation.

Continue reading "Adobe's David Coletta on Buzzword's Automated Testing Framework" »

Tags: buzzword flex testing

April 16, 2008

Flex 4

Some of the first hints about Flex 4 have been posted to the Adobe Open Source site. Great to see the future development of the Flex platform starting off this open.

Tags: flex oss

April 9, 2008

Debugging Bindings with BindingManager

At last night's BFUG meeting Peter Farland demonstrated an undocumented class called BindingManager that is handy for debugging bindings in Flex. This class exists in both Flex 2 and Flex 3. Below is a quick example of how it is used:

Continue reading "Debugging Bindings with BindingManager" »

Tags: bindings flex

March 31, 2008

Adobe AIR Linux Alpha

Adobe has dropped the first public bits in their effort to port Adobe AIR to the Linux platform. You can download them from Adobe Labs. Keep in mind this is an alpha release and everything definitely isn't there, yet.

Tags: air linux

March 10, 2008

User experience considerations with SQLite operations

An article I wrote for the Adobe Developer Connection entitled "User experience considerations with SQLite operations" has been published. Its focus is on issues Allurent uncovered while working with a SQLite database on the Allurent Desktop Connection application for Anthropologie that was demoed at Adobe MAX 2007 in Chicago.

Tags: adc air article flex

March 1, 2008

Antennae 1.2.0 Released

Antennae version 1.2.0 has been released. Grab it from http://code.google.com/p/antennae/. Highlights of this release include:

  • Changed to standard naming conventions for properties, targets, tasks, and directories
  • Updated support for AIR 1.0

For anyone not familiar with Antennae here is a brief description:

Antennae is an open-source project designed to automate the building and testing of Flex applications. It uses Ant and Java to provide cross platform utilities to compile Flex libraries, Flex applications, generate FlexUnit TestSuites, and run FlexUnit tests in an automated manner. Antennae also defines a framework for building complex projects with multiple dependencies and intelligently handling recompilation.

Tags: ant antennae flex

February 25, 2008

Flex 3, AIR 1, and OpenSource

Wow, it's amazing to think about all of the wonderful work that Adobe put into getting Flex 3 and AIR 1 out the door. My congratulations to everyone involved. Lastly the source for the Flex compilers is open source, I've already thought of some things I want to try with that. Download, play, enjoy.

As a side note, I've updated my simple Window Explorer application to run on the released version of AIR.

Tags: air flex oss

February 18, 2008

Abusing try..catch and throw

While looking something else up in the AS3 documentation this long weekend, I ran across this comment:

Typically, you throw instances of the Error class or its subclasses (see the Example section).

Emphasis added by me. If one typically does something, that means you can also not do it :) The throw statement takes an expression as its argument. The convention is to have it be a subclass of Error. This post isn't about that. In fact this post is a mental exercise as I don't recommend breaking from that convention, but I'm sure it might get someone's creative juices flowing, as I've not thought of a compelling use case, yet.

Continue reading "Abusing try..catch and throw" »

Tags: as3 catch throw try

February 7, 2008

Puzzling Proxy Problem: Solved

The short version is what AS3 operator triggers a call to the isAttribute() method of a Proxy? The answer, none. isAttribute() is a utility function provided by Proxy that can be called to determine if the name passed to a function was specified as an attribute. A couple of Proxy's methods can't be called in an attribute context, as noted below. I've created a sample Proxy class called MyProxy to help show what's going on:

package com.neophi.test {
    import flash.utils.Proxy;
    import flash.utils.flash_proxy;

    public dynamic class MyProxy extends Proxy {
        override flash_proxy function callProperty(name:*, ... rest):* {
            trace("callProperty", name, rest);
            flash_proxy::isAttribute(name);
            return null;
        }

        override flash_proxy function deleteProperty(name:*):Boolean {
            trace("deleteProperty", name);
            flash_proxy::isAttribute(name);
            return false;
        }

        override flash_proxy function getDescendants(name:*):* {
            trace("getDescendants", name);
            flash_proxy::isAttribute(name);
            return null;
        }

        override flash_proxy function getProperty(name:*):* {
            trace("getProperty", name);
            flash_proxy::isAttribute(name);
            return null;
        }

        override flash_proxy function hasProperty(name:*):Boolean {
            trace("hasProperty", name);
            flash_proxy::isAttribute(name);
            return false;
        }

        // Don't override isAttribute(), it is a utility function
        // used by methods that specify a name:* parameter
        // to determine if the name argument was specified as an
        // attribute. It doesn't look like there is any other
        // way to determine if a name was specified as an
        // attribute besides calling Proxy's isAttribute()
        // implementation. 
        override flash_proxy function isAttribute(name:*):Boolean {
            var result:Boolean = super.flash_proxy::isAttribute(name);
            trace("isAttribute", name, result);
            return result;
        }

        override flash_proxy function nextName(index:int):String {
            trace("nextName", index);
            return null;
        }

        override flash_proxy function nextNameIndex(index:int):int {
            trace("nextNameIndex", index);
            return (1 - index);
        }

        override flash_proxy function nextValue(index:int):* {
            trace("nextValue", index);
            return null;
        }

        override flash_proxy function setProperty(name:*, value:*):void {
            trace("setProperty", name, value);
            flash_proxy::isAttribute(name);
        }
    }
}

Continue reading "Puzzling Proxy Problem: Solved" »

Tags: as3 flex proxy

January 9, 2008

Truncating labels that use a percentage width

When an mx:Label is created, truncateToFit is true, and a percentage is specified for its width the label will show all of its content even if placed inside a fixed width container. The following example shows this scenario:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<mx:HBox width="100" horizontalScrollPolicy="off">
<mx:Label text="This is a really long label" width="100%" truncateToFit="true"/>
<mx:Button label="X"/>
</mx:HBox>
</mx:Application>

The result is which is not what I had hoped would happen.

Continue reading "Truncating labels that use a percentage width" »

Tags: flex label percentage width

January 6, 2008

New FlexUnit Flex Cookbook Entries

I've added some more advanced FlexUnit cookbook recipes that cover testing visual components and automated TestSuite generation. These can be found at Testing Visual Components with FlexUnit and Automated TestSuite Generation respectively.

Tags: antennae flexcookbook flexunit

December 22, 2007

Automated Visual Testing of Components

I'm happy to relay the announcement of the first public release of a new visual testing framework built on FlexUnit and AIR known as Visual FlexUnit. Some of you may have heard me make reference to this framework at my recent talks on Continuous Integration with Flex, FlexUnit, and Ant. Douglas McCarroll a recent inter at Allurent (the company I work for) developed the release. Here is what he had to say:

Visual FlexUnit (VFU) is a FlexUnit extension that allows you to do automated testing of components’ visual appearance using “visual assertions”. In a nutshell, a visual assertion asserts that a component’s appearance is identical to a stored baseline image file. These visual tests can be run in either a GUI or an Ant-based build process.

Another great tool to help with automating your testing.

Tags: flexunit testing vfu

December 18, 2007

Frankenstart: User Startup Experience

I've been thinking about the startup experience a user sees when launching applications. In particular I've been using a bunch of AJAX and Flex based RIAs recently. This observation is still gestating so I've not compiled a well defined list. It's one of those thoughts that I'm pretty sure is there and I'm just looking for additional evidence.

When browsing the web many HTML pages haphazardly form into the final view. Some of this is due to the order that the images, CSS, and other content pieces are loaded by the browser and some of it is the rendering speed of the browser, which has mostly become a non-issue. This experience is something that I think has fallen into the background consciousness of most people browsing the web. The thinking has become, that's just how HTML sites and web browsing work. Contrast that with how most desktop applications launch. There is still some waiting but aspects of the interface only appear when they are ready to be shown, instead of the half rendered state many a web page is briefly shown in.

Continue reading "Frankenstart: User Startup Experience" »

Tags: ajax flex frankenstart ria

December 16, 2007

Window Explorer Updated for Beta 3

I've updated Window Explorer to work with AIR beta 3. I think I've also got the new badge install for 9.0.115 working. I don't have my PC with Flash Switcher handy so I'm not 100% sure, will have to double check tomorrow. A quick recap of what Window Explorer is: Utility designed to allow easy exploration of the various Flex Window and Native Window options available in AIR. Code generation for selected options is included.

Updating to beta 3 was mostly painless, primarily I just had to remove stuff from the UI which Adobe took out.

Tags: air flex

Error creating AIR file: 103: ERROR, application.name

Last night I started playing with the public beta 3 drops for Flex 3 and AIR. Using the project creation wizard I created a new Flex based AIR application. After looking at the new application descriptor format which has changed a lot since beta 2 I started to customize it so that I could use it as a template for sample applications I was updating to beta 3. When running the Export Release Build... wizard it got through most of the .air creation process but then erred out at the end with the following message:

Error creating AIR file: 103: ERROR, application.name

A 0 byte .air file existed and a randomly named .tmp file was created.

Continue reading "Error creating AIR file: 103: ERROR, application.name" »

Tags: air error flex

December 14, 2007

Headless Linux Automated FlexUnit Testing Idea

When using Antennae or some other tool to run automated FlexUnit tests to Linux, it should be possible to use xvfb to create the display that the standalone Flash needs to run. With this approach you avoid the need to have a full X instance running while still being able to use the standalone Flash player to run the test SWF. I won't claim that this is any great insight, but I found a piece of paper on my desk with xvfb scribbled on it and I figured this was as good a place as any to record it :)

Tags: flex flexunit linux

December 7, 2007

Flex Camp Boston 2007: Ask the Experts

Rough draft notes

Panel: Dave Gruber, Tim Buntel, Phil Costa, Jeffry Houser, Todd Prekaski, and Paul Reilly

Q: When can Flash be multi-threaded?
A: Not for awhile. Tricky to do. Not in 10.

Q: What more will be in Flex for designer work flow?
A: Thermo is a new designer tool for converting wire frame into an interactive application. Also giving them tools to handle behavior. Improving skinning models and more declarative. Ely gave talk about this, should be up on MAX website.

Q: Best resource for a designer to get up to speed on Flex?
A: The Adobe Developer center. Grouped by background. Flex Cookbook. And watch for Thermo. Programming Flex is a great for an understanding of Flex in general.

Q: Any plans for different LiveCycle polling options?
A: Server side polling channel configuration (requires thread per socket). LCDS 2.5.1 should have examples about how to mimic real time latency. RTMP is best for non-blocking IO.

Q: Any ability to expand HTTP components to support additional REST capabilities beyond GET and POST?
A: Short answer yes. Flash player is limited by Flash and plug-in APIs. Workaround is to use the LCDS proxy.

Q: How best to handle authenticated remoting?
A: Use a session token. Usually rely on cookies with HTTP.

Q: Why use J2EE session ID as opposed to CF token ids?
A: J2EE session ID are superior to CF token ids.

Q: Any plans to include component that can display web pages in Flex?
A: Support is there for AIR. Can use frames to overlay SWF to get the behavior. No current plans since it requires Flash changes. Look at Drumbeat.

Q: Any plans to have .NET AMF tier?
A: No plans for .NET version of LCDS. Adobe is using a 3rd party Midnight Coders to provide similar services.

Q: Updated version of Cairngorm?
A: Run by Adobe Consulting. Best way to find out more is use their mailing list. Announced at MAX a data driven site version.

Q: ColdFusion application with CFCs for Remoting, what needs to change for AIR?
A: Hopefully nothing! Compiling against the services config does require a little tweaking when using AIR since config isn't parameterized in AIR. Pier (one of the sponsors) gave a talk on that behavior.

Q: Any mechanism to provide synchronous event handling?
A: AIR provides both synchronous and asynchronous. Log enhancement request against Player.

Q: Better Flash and Flex component integration?
A: On the radar to make it better. Flash to Flex is there. Flex to Flash isn't there yet. The component model conversion is a problem.

Q: Flex Builder 4?
A: Looking to users for ideas. Broadening audience that uses it. Let them know if you want to be involved in product planning. Put feature requests into open Flex bug system.

Q: How to synchronize SQLite to MySQL?
A: LCDS may do something in the future. ColdFusion at MAX showed some of the online/offline connection data management.

Q: Additional SQLite support for full SQL syntax?
A: Frozen for AIR 1.0.

Q: Status of code coverage tools?
A: Adobe consulting was looking to build an open source project but don't know the status. Plumbing has been added to player. Should be available soon.

Q: Ted Patrick commented about AMF being released?
A: No.

Q: Issues with profiler on 64-bit.
A: Player doesn't work on 64-bit machines, everything runs in 32-bit mode. Does work on Vista and Leopard.

Q: Linux support for Flex Builder?
A: Alpha of Flex Builder for Linux announced and released at MAX. Development ongoing.

Tags: flex flexcampboston2007

Flex Camp Boston 2007: Flex and ColdFusion: Mysteries Revealed!

Rough draft notes

Matt Woodward is talking about Flex and ColdFusion: Mysteries Revealed!

mattwoodward.com/blog

For ColdFusion people why use Flex: Very powerful. Simple. Big wow factor. Fun new technology. Don't limit yourself.

Sample photo gallery application, uses custom Flex components, ActionScript, and Events. ColdFusion back end that with RemoteFacade and DB layer.

Flex Builder needs to see ColdFusion's WEB-INF/flex directory.

Forget about request/response when dealing with Flex development. It's all event-driven and much more stateless. Events can be announced at any time. Request to server can be made but the response will come back at some undetermined time.

Business logic should not care who is talking to it. Can get input from anyone. Allows either ColdFusion or Flex to act as front-end. Facade isolates what Flex is talking about.

ColdFusion Components (CFC) and ActionScript (AS) can be translated between if done right. Must have mirrored properties. Have AS define "[RemoteClass(alias="path.to.cfc")]" and CFC define "<cfcomponent alias="path.to.cfc"/>". To return a collection use "<cffunction returntype="path.to.cfc[]"/>". Has good performance for most applications with reasonably sized collections.

Custom Events let you include your own custom data in the Event.

Accessibility questions about Flex? Doesn't have to worry about them. Member of the audience finds Flex easier to make accessible then HTML sites.

Will be posting sample code to his blog.

Where to do error handling? Has person making the call handle what to do if there is an error. Flex can handle ColdFusion error since it gets the error back.

Tags: coldfusion flex flexcampboston2007

Flex Camp Boston 2007: FlexUnit Testing with Cairngorm

Rough draft notes

Thomas Burleson is talking about FlexUnit Testing with Cairngorm

Looking at StormWatch and TestStorm used to test that information.

Showing demonstration of StormWatch. Loading XML data of stock market information.

Unit Testing: Test all the functionality of a single unit.
Continuous Testing: Test all units each cycle (each commit). Locally.
Continuous Integration: Test all units created by other developers.

Test API server exposed, transformations in Flex, business logic, event processing, and model updates. Not testing UI (hard to do).

Custom extensions to FlexUnit and Cairngorm to aid testing. Should be live on Google code early next year. Universal Mind (UM) Cairngorm.

Traditional testing approach requires extracting stuff. Bad because: Tests performed outside MVC, requires many test shells, and boundary conditions are not tested well. Focus on human issue (functional test) versus tool issue (unit test).

Uses parallel but different base package naming com..commands.* versus tests..commands.*. 1-to-1 for package, classes, functions.

UM Cairngorm adds: view responders, command event dispatching, delegate queues, batch events, command logic aggregation, and FlexUnit support.

Different unit testing frameworks include: ASUnit, FlexUnit, dpUInt, and UM Wrappers (builds on FlexUnit).

Cairgorm Explorer is a handy application.

Showing how the unit tests are constructed and run. Importance of testing with events to mimic what the UI is doing as much as possible.

Have Synchronizer that watches for code changes and creates stubs automatically. May not be opened sourced but good to think about the ideas.

Tags: cairngorm flex flexcampboston2007 flexunit

Flex Camp Boston 2007: Building Buzzword

Rough draft of notes

David Coletta is talking about Building Buzzword.

Jan 2006, started coding in an attic. Oct 2006, public demo at MAX and funding from Adobe. Nov 2006, more people and real offices. May-Aug 2007, monthly preview releases. Fall 2007, open for real use.

Show documents by alphabetically, author, role, last viewed, last modified, # of pages. Custom scroll bar with numbers in it. Able to click on scrollbar to jump to location. Leave comments in document. Also supports tables and advanced formatting capability.

Text on page. Three main pieces: document (content being saved to server), layout (transient position of the content, relay out after every character), and display (Flex/Flash objects on display list). Flow: document to layout. Tries to optimize what changed and handle as few things as possible.

Document internals: Body with one Section has multiple Paragraphs each with multiple Runs. Run has AnchoRun and FontyRun as subclasses. FontyRun has BreakRun, FieldRun, and TextRun and subclasses.

Use custom Tree ITreeDataDescriptor to provide custom tree data providers that can manage any custom data type. Not just XML.

Screen metric - print metrics = micro-spacing to get consistent layout between screen and printing. Very expensive to calculate but vital to getting consistent layout between the two.

Cache of display elements so that only certain objects are shown at once. Buzzword controls what is rendered on screen since the number of text fields for a document would overwhelm the Flash player.

Buzzword back end is .NET and uses low level HTTPService for back end communication. Backend does comment notification, document locking, and other raw CMS features. Login over SSL. Parking HTTP request on the server which then responds when it has data to send to the client.

Testing was vital primarily used FlexUnit. Spent a lot of time developing custom test framework called LiveTest. Focused on document command validity not focused on UI (like QTP). Able to record, debug, train, and playback a test. Generated ActionScript code can be copied back into the platform. Wrote custom framework instead of something like QTP required more constant feeding of unit tests.

Custom skinning scroll bar in Flex 2 was difficult. Hard to get skin to draw text (much improved in Flex 3 with UIComponent skinning model).

Has modular loading. Caches editors, styles, fonts, but if not there is displaying a progress loading bar. Pro: Improves build times, background loading, and good design through information hiding. Con: Can increase overall download, slow overall build, and increased complexity. Debugging across modules is hard, need runtime switching of loading debug versus production. Centralized control of what gets loaded when based on startup mode to prioritize based on startup mode.

Merge user dictionary on a collaborative document into a document dictionary to provide consistent spell checking. Look at gskinner.com for spell checking libraries.

Rich Text Copying is not supported by Flash. Hidden IFRAME or DIV render content from HTML control to allow clipboard content to be rich content. Push focus back to browser so that it picks up copy/paste events.

Off the shelf Flex isn't used much (more for debugging components), leveraging low level components (UITextField). 90% custom AS versus 10% MXML.

David's blog: TheJoyOfFlex.com

Tags: buzzword flex flexcampboston2007

Flex Camp Boston 2007: Rich Commerce on the Desktop with AIR

Rough draft notes

Joe Berkovitz and Tim Walling are speaking about Bringing Rich Commerce to the Desktop with AIR.

Case study and development notebook presentation.

Wanted to provide rich vibrant shopping experience online and/or offline. Utilize local persistence mechanisms for shopper customization. Business users can author experience. Fast local database. Online conduit for checkout.

Showing a demo of the demo application developed with Anthropologie, a canned demo online. System tray notification, scrolling of primary view, continuity of experience with zooming into product details, ability to locally tag items, search by color, with drag and drop image support, and the ability to have the merchant modify the content shown in the application.

Architecture for final product: web server provides updates and AIR application with an existing commerce server and analytics engine. Update manager supplies catalog meta data, media and markup. Content integration merges local files with web server supplied content to provide a uniform interface to the rest of the client. Personalized data persisted locally in the SQLite data.

Demo made everything local, minimal fixed product catalog, and tweaks to make the data work for the demo.

WindowedApplication is the primary application instead of Application. Chromeless window to get complete control over the look and feel. Different application modes are accomplished by command line arguments. These alternative modes much be manually created. Able to have application startup in system tray only mode.

The AIR application descriptor defines how the application startups. Key values are systemChrome, visible, and transparency are used to control the look and feel. Controlling window is through simple calls like minimize() and startMove().

System tray notifications are custom coded. Need to make sure you take into account screen size and multiple monitors.

Able to use "like" query against SQLite for simple text based searches.

Color search requires custom cursor management to provide custom color widget overlay. Color wheel itself was an image versus dragged in image handled the same way. When using drag managers in AIR there is a NativeDragManager that gives you access to the Clipboard format. Different applications supply drag data differently, such as IE giving a URL for an image versus Firefox giving the raw bitmap data. BitmapData.getPixel(x,y) can be used to color sample images.

The navigation strip navigation is about content. Uses goal based animation to provide smooth scrolling to handle rapid changes in what the user wants to see. Setup want you want to change and how it should change over time. Just supply the value you want and the engine maps to that goal.

Database populated for SQLite by using existing database file. Custom AIR application was created that could read in and populate the SQLite database. Some SQLite tools are available on labs to make working with the files easier (run queries, create tables). Rewrote integration to pull form SQLite database instead of a web service.

SQLite usage internals. DAO to isolate database gunk from the rest of the application getProduct(uri:String, handler:Function). Translator handles SQLResult translation into ActionScript objects.

Asynchronous API to keep event loop alive. ConnectoinPool and StatementPool to manage connections and statements to improve performance. Caching statements saves the need to reparse the statement.

Color match requires looking at color wheel. A given RGB value wasn't matched exactly by anything in the database. How to get close. Instead used HSV (hue, saturation, luminescent). See wikipedia for more details. Used color swatches to extract data for every product. Extract all HSV values and then do a linear search. Not that much data to pull into memory. Animate product results by looking at intersection of two result sets. Fade out what went away, fade in what is new, and move anything to its new position.

Goal based animation is about providing seamless animation experience. All about getting to some state. Doesn't use easing or tweans to apply real-time updating of what the goal is. Can work on multiple properties at once (alpha, position, size). Takes the most direct path to get to the target goal.

To get to the pilot: need to have the application download more content, update mechanism to see the new edition, enable offline cart, and additional personalization capabilities.

Tags: air flex flexcampboston2007

Flex Camp Boston 2007: Using ColdFusion with LCDS

Rough draft notes

Tom Jordahl is talking about Using ColdFusion with LifeCycle Data Services.

Why Data Services?

Powerful back end. Talk to ColdFusion. CFML to manage complex data.

LCDS with CF 8 installed by default.

Messaging: Publish & Subscribe, asynchronous communication, message header and body (can contain complex types CF components or ActionScript types), CF can both produce and consume.

Why messaging?
Real-time notification to your Flex application.
Triger long running server side processes
Notify multiple clients at once

messaging-config.xml contains the data along with reasonable defaults.

Easy to have CF both handle and publish messages that will be broadcast to all clients that are listening.

Client can do HTTP pooling to get around RTMP firewall restrictions.

Data Management

Distributed data management, data replication and synchronization, able to manage large data, nested data one-to-one or one-to-many, has some occasionally connected clients.

All clients that are looking at data will get notifications based on updates that are made. The changes are batched up.

Why Data Management?
Easily synchronization data between clients with conflict detection, data replication, and performance optimization (such as data paging and lazy loading).

Assemblers manage the data. Can be written as ColdFusion Components or Java, leverage Hibernate. Four main mehtods: Fill, Get, Sync, Count.

CF 8 extension for Eclipse are freely available. Gives you RDS (Remote Development Service). Includes query builder. Automated creation of ColdFusion Components and ActionScript classes related to database object management including the Assembler.

Special CF channels: cf-polling-amf (work around firewalls), cf-rtmp (off by default).

Possible to have existing Java or CF applications notify clients of data changes using new Event Gateway.

Able to configure that certain data pieces don't trigger changes being published as a way to optimize changes.

JSP tag to compile MXML applications on the server available on Labs.

All data transmitted via binary AMF3 protocol.

www.adobe.com/go/lcds_devguide
www.adobe.com/go/lcds_javadoc

Tags: coldfusion flex flexcampboston2007 lcds

Flex Camp Boston 2007: Using the Flex Profiler

Rough draft notes

Paul Reilly is speaking about Using the Flex Profiler

Memory profiling lets you look at objects being created, take snapshots and compare them. Performance profiling allows snapshots for looking at cumulative and internal time.

Memory profiling is light-weight compared to performance profiling when configuring the settings.

Profiler runs at the end of the frame which is why there maybe delays in getting updates to the profiler in Flex Builder.

Memory leak detection work flow: select app and take memory snapshot, switch to application and perform an operation, then take a second memory snapshot. Select both snapshots and view loitering objects. Can look at back references to determine who is holding onto something. Most common memory issue is strong references with event listeners. Can either remove the listeners manually or in most cases it is possible to use weak references. Best to reset profile information at the start unless you want to focus on initialization phase.

Can profile any external SWF, in general this is done with the standalone Flash player. Filtering of artificial functions isn't there yet (such as reaping, mouse handling, etc.) but you can change what gets shown such as removing the mx.* filter.

With performance profiling you can look at callers and callees to see how a function is being used. Important to remove filters so that mx.* abd flash.* are included in the list unless you want to focus only on your code.

Profiler supports debugging capabilities. mm.cfg file can be used to control settings. flashlog.txt doesn't get created if using a release version, good way to test that you are using a debug version of the player.

ErrorReportingEnable=1
TraceOutputFileEnable=1
PreloadSwf=ProfilerAgent.swf?debug=true

Additional information outputted into flashlog.txt that shows what the profiler is doing.

mm.cfg is only read once so if you are using multiple tabs in a browser it is only read the first time.
Runtime exceptions or infinite loops will cause the profiler to not work very well.
Taking a memory snapshot implicitly makes a garbage collection call.

Internally the player is using a stack trace (once every millisecond) for performance timing, new object samples (every time an object is create), and delete object samples (every time the GC collects an object). flash.sampling package includes way to get at the same information if you want to roll your own profiler.

DisplayObjectContainer and EventDispatcher are classes that are hard to get the internals of and there are back door methods to get access to data useful for profiling.

Profiler is sample based (not trace based), provides quicker profiling but not as detailed.

When is the best time to take snapshots? Look at overall memory chart to see where the issue might be. Try to narrow down operation in application that causes memory increase. Then start taking snapshots before and after performing that application.

Can you programmatically trigger a snapshot? Not at this time but create an enhancement bug and vote for it.

It is possible to profile AIR applications.

Tags: flex flexcampboston2007 profiler

Flex Camp Boston 2007: Config, Debug, Deploy LCDS

Rough draft of notes

Peter Farland is talking about Configuring, Debugging and Deploying LiveCycle Data Services.

Notes from the talk will also be posted to his blog.

Version issues with LCDS

A LCDS version is best used with the version of the Flex SDK that comes with it, in most

Flex 2.0.1/FDS 2.0.1
Flex 2.0.1 HF2/LCDS 2.5
Flex 2.0.1 HF3/LCDS 2.5.1
Flex 3/LCDS 2.5.1

Client side: rpc.swc and fds.swc and services-config.xml are the key pieces to keep synchronized. Don't forget fds_rb.swc.

If you find a bug open up the swc and look in catalog.xml to report the version you are using. The jar file has a similar version in the manifest.

Performance very tied to java version. 1.5.0_07 is very bad for performance. Avoid 1.4.2_02 to 1.4.2_05 and 1.4.2_10. 1.5.0_13 is recommended.

Configuration

Flex compiler knows about services-config.xml. -services compiler flag generates needed AS3 code. -services isn't needed if you want to roll your own ChannelSet management code.

Multiple Channels in a ChannelSet provides failover.
Use a single ChannelSet for all services in the client.
Only authenticate once per client ChannelSet.setCredentials().
Allows runtime determination of secure channel selection.

Programmatically create the ChannelSet to provide a poor man's load balancing. Randomize the order that the Channels are defined is. Still give you fail-over but the random list gives some load balancing (Math.random()).

LCDS messages brokers can create MessageDestinations on start programmatically instead of having to specify everything in a services-config.xml.
Important to optimize your configuration file and get rid of sample pieces and channels that are not used. Can improve compiler performance since it is less data to parse and manipulate. Be sure to remove debugging and redployer watchers from a production configuration file.
Sun's JDK XML parser should be replaced by xalan.jar.

Flex Builder only supports one project in memory at a time. Only the last edited project is retained in memory for incremental builds.

When debugging make sure you have references to data types retrieved from runtime otherwise they won't be linked in. Missing flash.utils.IExternalizable leads to "one of the parameters is incorrect" error which can be solved by referencing the class.

Client side debugging: will dump additional information to flashlog.txt. Paros Proxy, Charles, ServiceCapture are great client side traffic sniffers.

Server side debugging: Can configure debugging levels in services-config.xml. LCDS includes a server side tool sniffer.exe.

Common browser issue is non 200 HTTP status codes.

When doing deployment compile your SWF and simplify your web.xml file. LCDS 2.5.1 allows configuring client point to be secure while server uses HTTP to allow using SSL accelerators. RTMP can use the bind-address and bind-port to allow hooking it up to a load balancer. Resource availability can be problematic on hosted web servers since most are tuned for short lived connections on persistent connections that LCDS uses.

With LCDS express (limited to 1 CPU) 1000 plus users with RTMP should be possible since it is multiple threaded. Other techniques like servlets would block too many threads.

Tags: flex flexcampboston2007 lcds

Flex Camp Boston 2007: Keynote

Rough Draft Notes

Christophe Coenraets is giving the Keynote

Talking about Flex 3 Improvements

Advanced DataGrid: hierarchical data, flexible grouping, custom formatting
Charting Enhancements: data-oriented graphical APIs, per-item labels and fills, region selection
New List and Data Effects: choreograph data

Showing iLog charting example
3D bar and data charts
Organizational chart example with grab and pan

Showing code example with the AdvancedDataGrid

<mx:AdvancedDataGrid>
<mx:GroupingCollection>
<mx:Grouping>
<mx:GroupingField name="category"/>
</mx:Grouping>
</mx:GroupingCollection>
</mx:AdvancedDataGrid>

Need to tell grouping collection to refresh itself.

Persistent Framework Caching
Flash player caches Flex framework across projects and sites.
Size of target SWF can now be as small as 50KB.

Base application size 600KB, removing debugging via compiler flag -compiler.debug=false 380KB, Flex Build path/library path/framework linkage, change that to runtime shared library, 200KB. Has fall back capability to support loading SWF instead of using signed SWF caching.

Memory and profiling and code refactoring are two big improvements in Flex Builder 3. Demonstrating sample application called Salesbuilder as a way to show these two new features. Source code is available off of his blog. Application is AIR based and supports desktop drag and drop to save graphs along with offline data synchronization using the SQLite DB and LCDS. Next talk is about profiler so this he isn't talking about it. Showing find references and rename variable support.

Designer and developer workflow is improved through skin asset importing and CS3 Flex component support in Flash. Showing Fireworks example of show to easily skin a button, export the asset and pull it into the Flex CSS file. Once in Flex Builder one can use the new CSS Design view to manipulate the file. Ability to graphically assign Scale 9 parameters that it updates the CSS file with. Can also export style information from Flash.

Flex Builder 3 now supports wizards for working with data and web services. Will generate both client side and server side code in PHP and some other languages for data access. Can introspect a web service through a wizard, select desired methods, and generate stub code on the fly that is strongly typed.

Flex 3 has enhanced JavaScript/AJAX wrappers and improves the deep linking support from Flex 2. Showing deep linking support in Buzzword. All about anchor management. Can leverage the existing URLKit.

Showing new Flex pricing and packaging. Flex 3 SDK, free, Flex Builder 3 standard is $249, there is other pricing.

bugs.adobe.com/flex
www.flex.org/community


Tags: flex flexcampboston2007

November 18, 2007

More FlexUnit Flex Cookbook Entries

I added a couple more introductory FlexUnit recipes to the Flex Cookbook. They are titled Understanding FlexUnit Output and Run code before and/or after every test. Next up will be some intermediate recipes.

Tags: flexcookbook flexunit

November 15, 2007

FlexUnit Flex Cookbook Entries

I've posted round one of some Flex Cookbook entries that focus on FlexUnit. I welcome any feedback on have about them.

Tags: flexcookbook flexunit

November 10, 2007

Allurent News

Allurent the company I'm working for has been doing well lately and as such we are starting another major hiring push. We've recently signed a strategic deal with GSI Commerce to provide our full product suite to their customers and have closed a $7.5M Series B.

Our details, inline cart, and checkout are live at Anthropologie. To see details you need to visit a product category page and then click on the hotspot marked by a magnifying glass icon below any product image. To see inline cart, just hover over the "shopping bag" link at the top right of the page.

Continue reading "Allurent News" »

Tags: allurent

November 8, 2007

Flex Cookbook Code License?

The growing Flex Cookbook is great for finding answers for a wide range of problems. The problem is the site doesn't make it clear what license everything is under. For a developer creating a product that uses some of the cookbook code what might it mean? Your guess is as good as mine. For an entry I posted I cited the license the code fell under. While other examples are not as clear. What does that "@author" mean?

I think for the Flex Cookbook to be a general purpose reference it really needs to clearly state the license all code falls under. Ideally it should establish a blanket public domain license. If I'm missing something please let me know.

Tags: cookbook flex license

November 5, 2007

Styles, Fonts, and Compile Time

There has been some recent conversation about the impact of styles and fonts on compilation time in Flex Builder 3. I figured I'd take the project I'm currently working on and see what the numbers came out as.

Some more details about the test: About 700KB of raw .as and .mxml code. 2 separate CSS files are imported. 120KB of TTF fonts. 650KB of SWF fonts. Compiling using Flex 2.0.1 Hotfix 3 SDK. Each tests was run 3 times with the average time reported. Each test was run by changing text in the top level MXML component, saving it, and timing a manual build. Timing was from time of click until the progress view reported the build was finished. Copy non-embedded and generate HTML template were disabled.

As with all measurements these should be taken with a grain of salt and are meant to be representative. Your project will vary, yadda, yadda, yadda.

Continue reading "Styles, Fonts, and Compile Time" »

Tags: as3 css flex

November 4, 2007

AIR support added to Antennae build template system

I'm pleased to announce Antennae release 1.0001 has now been posted. The full release notes are available online. Please leave me any feedback if you run into issues or have feature requests. Below is a summary of the key updates:

Flex based AIR application support

New targets and tasks have been added to support the building, running, and packaging of Flex based AIR applications.

A sample project has been put together that demonstrates the use of these new targets.

A key concept used in AIR application support is the concept of an "assets" directory. Since the AIR ADT application packager requires you to specify each file that should be bundled into the application, Antennae has instead chosen to specify a single directory. The goal being that by default all files under "assets" will be packaged with the application and there is no need to include these files in the source tree.

Simplified importing

All template applications have been updated to use the new single build-common-imports.xml file to pull in all standard Antennae build files.

Source code included

The source code for the ARC-FlexUnit pieces are now bundled with Antennae. This is for reference purposes. To rebuild the platform please grab the latest source code from the SVN repository for Antennae. http://antennae.googlecode.com/svn/

Linux fixes

Fixed bug about not being able to run automated unit tests on Linux.

Tags: ant antennae flex

October 24, 2007

Adobe Offers Flex Builder 2 to Students and Faculty at No Cost

Adobe announced today that beginning in November qualified education end-users will be able to get Adobe Flex Builder 2 for free. I think this is another good move on Adobe's part to help open up and promote the platform.

Full details here.

Tags: flex

October 7, 2007

AIR Window Explorer

I spent most of today putting the finishing touches on a utility AIR application. The application is geared towards making it easy to explore what kind of custom Flex Window and Native Window objects you can create and how they look. It includes some debugging features and the ability to generate AS3 and MXML (Window only) code that matches the selected options.

I played around with the latest SWFObject and the badge install so that grabbing the application should be painless. Window Explorer Download Information.

Let me know if you run into any issues or have ideas for improvement :)

Tags: air flex

October 4, 2007

Continuous Integration with Flex, FlexUnit, and Ant

I've posted a version of my slides (0.5MB PDF) that were used for my Flashforward talk and MAX talk under the titles "Automation of Flex Building and Unit Testing" and "Continuous Integration with Flex, FlexUnit, and Ant" respectively.

The demonstration files used in the talk are mostly equivalent to the tutorial and template directories that are included in Antennae.

The resources mentioned in the talk are listed below:

Tags: ant flashforward2007boston flex flexunit max2007chicago

October 2, 2007

MAX 2007: Keynote 2

Rough Draft Notes

Kevin Lynch

adobe.mtv.com Adobe AIR contest now open

Bruce Chizen

Financial community is like tooth drilling without novocaine. Press is fascinating. Print the words he says but surrounding it with other stuff, which isn't what I meant. As as CEO privacy is an issue. How much he makes is public. Now as a CEO there is legal risk, signing his life away.

Saturday. Dave Mathews Band concert. Back-stage pases. Talking about Adobe products.

In Keynote, sneak peaks, what developers/designers do with tools Adobe provides.

Kevin

Server, Services, and Tools

Back common server side patterns into server code and reuse there.

Steven Webster

Experience matters, that happens on the glass. Experience behind the glass. LiveCycle ES, back-end to rich experience front-end.

Mitch Fried (mfg.com) online marketplace, geographically diverse, RFQ lots of data. Real-time back end matching., 3D PDFs with policy settings.

Steven

LiveCycle on top of Java SOA. Data services (what was FDS) is one piece of LiveCycle.
LiveCycle workbench (Eclipse based). Form guide builder. Getting to scan a piece of paper and turn it into an RIA.
Rights Management and Digital Signatures. Prevent printing or emailing. Assure return of confidential information.
Process Management. Workspace ships with LiveCycle to define and work with processes.
LiveCycle is available free on devnet.

Kevin: Adobe looking to create hosted services.

Scene7 Imaging, Share, Pacifica, CoCoMo

Doug Mack: Scene7, Rich media service and automation. Single master image. Many parameters to control flow. Demo of online uniform creation. Take content for granted and just design the experience. Delivered as SaaS. Scene7 image portal. QVC demo with AIR, Scene7, and Video. Looking to be as strong with print and online.

Andrew Shebanow: SHARE, file sharing in and outside firewall. 1GB of storage. Uploaded file from desktop, virus scanned, emailed person data was shared with, thumbnailed document. Viewer is Flash Paper on steroids. Embed file into HTML page through custom control. REST APIs (upload, share, retrieve). Also have AS3 libraries. In the future more improvements with file formats and organizations.

adobe.com/go/share/ beta available now.

Danielle Deibler: Pacifica, high quality voice, messaging, and presence. Almost like HD voice. Video preview sharing. Point-to-point connection on top of Pacifica service. High quality voice, text messaging, presence, NAT and F/W traversal. Roadmap: video, p2p, air, pstn access.

Private Beta starting this month, looking for people with applications that would fit the platform, also they are hiring.

Nigel Pegg: CoCoMo, Adobe Connect, been working on new client-server platform. Client UI now in Flex, now UI component framework, have access to lower level APIs. Opening up hosting infrastructure, real-time data messaging, av streaming. , , ,

Kevin: Thermo (Designers to create RIA)

Mark Anders, Stephen Heintz: Thermo, RIA Design Tool. Creating Flex applications. Own design. In context (x, y, width, height) display. Flex framework extensions (mx:Graphic, mx:Rect). Import PSD. Options to treat layers. (mx:BitmapGraphic, mx:TextGraphic). "Convert Artwork To". List management (auto random data). State management and automatic transition creation. Visual bind of controls. Automatically repeat sample data. Thermo and Flex Builder share project definitions.

Start to be available next year.

Kevin: XD

Mike Sundermeyer: What makes a great experience. Adobe inspire experience design site.

xd.adobe.com (alpha) Case studies, design patterns, hot topics.

Kevin: Biggest Flash Device. Susan B Yacht, Captain Kirk. InteliSea.

Tags: flex max2007chicago

MAX 2007: On AIR Security

Rough Draft Notes

Lucas Adamski

AIR Threat Model
Installation
Runtime managed dialog, application signed by CA, self-signed = unsigned
Line between guaranteed harmless/automatic execution to full privilege/explicit install.
Only time user makes a decision is on the security dialog
AIR updates must be signed by the same publisher

Elevation Attacks
Remote content should not be able to discover anything about local system.
Should not be able to cross sandboxes.

Injection Attacks
JSON isn't a problem, JSON by eval() is the issue.
Smallest sandbox is a frame.
Injection Vectors: Code importing, DOM manipulation, URI schemes, Code generating functions.
Focused on protecting the user, not the developer.
Mitigations: Escaping or stripping (requires diligence). Clearly separate code and data (SQL prepared statements are a good example).

Typical Desktop Application Threats
Writable files
Credentials stored insecurely
Default passwords
Buffer and stack overflow
Upgrade/downgrade attacks (manually uninstall to downgrade)
Applications should not update without explicit user permission, no runtime importing to application content from remote servers.

AIR Security Model
Scripting languages have greater access than browser
Dynamically loading shouldn't have access
Provide loading mechanism that puts loaded data in its own sandbox
Explicit communication mechanisms
Safer cross domain data

AIR Does Not
Can't run untrustworthy applications
Prevents security mistakes
Has sandbox to guarantees security

AIR Does Provide
Full system access
Explicit installation
Signed applications

Guiding Principles
Local and remote data is like running in a browser
AIR shouldn't be natively more dangerous than other platforms
AIR shouldn't be a vehicle for attacking machines
AIR shouldn't require security guru
Develop paradigm during beta process

Flash in AIR
app-resource vs. app-storage
Application content: no asfunction, loader.loadbytes(),
Non-application content: no direct AIR API
No one: no write to app-resource, sandboxBridge

HTML Security Model
Application (desktop model) vs. Classic Sandbox (Browser like)
Application: direct air access, set innerHTML but script ignored, dynamic allowed only during load
Classic: dynamic always permitted, script for JSON are fine, no direct AIR API

Have to wait for parent Sandbox bridge before you can do anything

Cookies can be turned on/off.
SSL supported
Secure local store API, generic secure key storage (app ID and user Key)

Q: If I download a SWF into application-storage will that have fewer privileges than a SWF loaded from application-resource? Yes. Looking in the long term to provide plug-in API (not 1.0). Bridging will get you there. In general it's not prevented just discouraged.

Tags: air flex max2007chicago security

October 1, 2007

MAX 2007: Case Study: ESRI Geospatial Application Using Adobe Flex

Rough Draft Notes

Mansour Raad

ArcWeb Services, APIs for adding GIS data to applications.

Data Visualization: GeoRSS includes lattitude, longitude, point, line. Looking to create 2D/3D map interaction. Vector data is much faster to work with (Poly 9). gwx:Map and poly9:Globe are a couple of components that make it easy to work with the data.

Mashups: Edge 305 to gather data. Created a GPX feed. Combined with photos and leveraged ESRI map data to show route and tag with photos. gpx:GPXLayer and awx:BubbleMarker were some of the components used.

Framework in general. User has full control over draw methods. Supports client side spatial searches. Showed example of circling section on map and highlighting those points within it. Uses client side RTree. Using the server select a point and call utility.getDriveTime returns geometry object with real-time 5 minute drive time radius. Has server side natural language processing to determine location. Example was "Let's get a Chicago deep dish pizza at the corner of main and elm in Boston." Determines that Chicago isn't a location.

Mentioned MIT Simile AJAX project to combine GIS data with time line visualization.

SHP file format. There is a Google code library that can read it.

Modify display with things like Graphics.curveTo with a control point.

ERS demo application. Placed barricades on map and allowed people to determine how to route around them. Used to help Minneapolis public after bridge collapsed.

Beta of APIs and services available at www.esri.com/flex

Other URLs of interest
www.arcwebservices.com
thunderheadxpler.blogspot.com

Tags: flex gis max2007chicago

MAX 2007: Best Practices for Developing with ActionScript 3.0

Rough Draft Notes

David Hassoun

Talk will focus on resources and guides, this isn't a how to.

Three main pieces: Analysis (what to do), Design (how to do it), and Implementation (creating code)

Saffron AIR UML Tool, Enterprise Architect, UML and a focus on class diagrams
Unit testing frameworks include FlexUnit and ASUnit

Coding Guidelines: Doesn't matter what you pick, but consistency is key.
Areas to consider: object creation policy, variables typing and scoping, package structure, class structure, naming conventions, code commenting, and curly braces

Not confirmed but mentioned something about declaring multiple variables on a single line as being more efficient. (ala. private var foo:String = "", bar:String = "";)

Program to interfaces.

Memory and performance. Areas to consider include: deferred instantiation, paging in data, don't load assets until needed, remove references, remove trace statements, use the mxmlc optimize flag (on by default I believe), use int as type of loop counter.
Unconfirmed but mentioned accessing static member variable in a loop is more expensive then copy value to local variable and referencing that instead.

Architecture: Create and use frameworks (reusable code blocks).: provide proven and targeted solutions and the expense of code size and potential bugs. Design patterns are repeatable solutions and should be used as needed. RSLs and modules great for sharing code and leveraging testing effort (once tested can be used again with higher confidence). Look at using -link-report and -load-externs command line options. Flex 3 is adding cached framework library. Flex Builder 3 has UI for setting up and using modules.

Best practices: code management and version control. Create code integrity, do unit testing, and continuous integration.

Tags: as3 flex max2007chicago

MAX 2007: Keynote

Rough Draft Notes

Kevin Lynch is giving the keynote.

Connect. Discover. Inspire.

MAX around the world. MAX the dog is in the AIR park.

Adobe Developer Connection is launching.

Connect beyond the conference with Intronetworks.

25th year anniversary of Adobe. Going to keep staying on the leading edge. Pushing technology forward.

Shantanu Narayen. Best attended MAX ever. Time is right for brand new type of application. Combine power of desktop with interactivity of the web. How to engage customers, need to keep them front and center.

5 rules for experiences.


  1. Content is king: interface can be barrier to getting at content. Think about content first.

  2. Make it personal: one size doesn't fit all. What the user wants when they want it. N70 news demo contrasted with 17 year old MMS and entertainment focus

  3. Less is (still) more. Focus on a few things and do them really well. Premier Express video editing experience demo. Simple Drag and drop experience to create timeline, add borders, captions, and edit clip length.

  4. Movement has meaning. Actions meets expectations of user. Adobe Media Player, using glide UI transitions to help the user know what is going on.

  5. Create an experience not a UI. California Tour ride site as an integrated experience example.

Take quality of digital experience to a whole new level. The Internet, Remixed.

Kevin is back:

Video:

70% of video on web is Flash. H.264 is becoming widely adopted, now in Flash player. Yahoo video: view HD content with custom UI without re-encoding. Plan to playback support iwht Adobe products. Up to 1080p, full csreen hardwrae acceleration. 480p versus 720p video comparison at full screen. Halo 3 Great job of Microsoft using Flash on their website.

Adobe Media Player: Bring in video, streaming or download. Catalog of video feeds. CBS, PBS, and long-tail content. Associate Ads with content or free stuff. Pre/post, on top, and overlay ads. Available on labs today.

FlashLite 3.0 will be available on Nokia soon. Video being brought to mobile phone. Nokia N95 with video demonstration, same CSI clip. Flash Media Server delivering video.

Websites:

United Way example being improved with Cold Fusion and Dreamweaver, presented by Ben Forta and Scott Fegette. Cold Fusion 8 is out, Dreamweaver CS3. What features could be added. Custom experience based on combining form data with custom generated PDF based on data entered. Dreamweaver CS3 Spry 1.0.6 available on labs. Using accordion framework. Apply source code formatting in CSS file. ColdFusion ships with LifeCycle Data Services. Capture bitmap data send it to the server, save as a JPG and then AJAX to include it on the page.

Applications:

Scrapblog built with Flex. Get desktop applications connected with AIR.

Giving an overview of AIR is Ed Rowe. Custom Manager by Nitobi. Sales representative to use in the field and integrates with Salesforce.com. Putting rich experience on more than one application. Dragging VCard from desktop and loading into desktop application that is syncing up to website. Beat 2 of AIR, Beta 2 of Flex 2, Dreamweaver AIR Extension, and Flash Authoring AIR Extension are now all available on Labs.

300,000 downloads of AIR runtime and 100,000 downloads of SDK. Flex is now free, best way to build RIAs.

Flex Team Heidi Willimas is talking about developer features. 4 new features.

  1. Profiler
  2. Language Intelligence
  3. Advanced Data Visualization
  4. Flex Framework Caching

Giving profiler demonstration. Jump from report to method. Refactoring of method name. Lots of styling with advanced data grid. Drag select and drill down information. Multiple column sorting.

Kevin is talking about AIR Developer Derby. Five winners.
Spaz.AIR, Ora Time Tracker, Agile Agenda, SearchCoders, Digimix. Agile Agenda is overall winner. Demonstration of application.

eBay launching their AIR application today. Bob and Cary from Disney and Frog are showing their application online. Travel agent application that is outside clutter of email and Disney branded. Frog Design was doing design work. Store offers locally. Customer management list. Drag and drop selected text from PDF. Created PDF right from application.

Tweetair (sp?) (Twitter application), Snippage (make your own desktop widgets by clipping websites), Pronto! (Calendar application with Google analytics integration), Paypal (Transaction history, charts of history, showing drag and drop between AIR applications), SAP Briefing book (Synchronizing data, charting against dragged in Excel data), Digimix (Audio editing, save as WAV to disk), Pownce (Social networking application), Nick.com (puzzle, tied into web site), AOL Top 100 Videos App (Video browsing and viewing), Buzzword (Flex word processor, desktop AIR and online, documents optionally saved online, Microsoft DOC import) Adobe has acquired Buzzword company, Anthropologie (Cross media experience, print catalog, email, website, and desktop application, search by color, personalized note experience, build by Allurent),.

MTV and Adobe AIR Challenge.

Announced Facebook chat application using their API and build on AIR being worked called WaveIM (sp?)

Astro Flash player being presented by Emmy Huang and Justin Everett-Church: Advanced Text Layout Support (bidirecitonal language support). Correct word wrapping. Multiple column support. Native support for perspective transforms. All display objects can be transformed in 3D and maintain full interactivity. Rotation X, Y, and Z. Custom filters, blends, and fills. Hydra (sp?) new effects language. Toolkit available on labs today. Pixel sampling technology.

Tags: max2007chicago

September 22, 2007

Flashforward Boston: Beyond the Knowledge; The Art of Playing

Rough Draft Notes

Erik Natzke, Natzke Design

play.natzke.com

comes to interactive design from a design background.

looking to animate things in an organic manner
Flash is a digital sketch book
freeze and analyze life.
everything in advertising needs to have reflection

system based on percentages so that 15 second always takes 15 seconds
need to account for resizing
inventing new ways to be lazy

how do you make things file size sensitive.
build tools for yourself

curves and way points are a big thing

phenomenal flash generated video for an art installation.

Tags: flash flashforward2007boston

Flashforward Boston: BitmapData and 3D Image Manipulation in AS3

Rough Draft Notes

Paul Ortchanian, Goodby Silverstein & Partners

Effects don't all need to be done with OOP

Don't always view in terms of x and y. view in circle instead 0, 180, 360 degrees.
think in circles, best way to think of programming in 3D

cerate illusion of depth by scaling elements.
scale=fl/(fl+_z);
_x=x*scale;
_y=y*scale;
_xscale=_yscale=scale*100;

principal rotations

pitch, roll, yaw
find formulas on wikipedia

need to eliminate objects in background

bezier formula

model tween as line that point follows x, y determine speed at each point

Flash 8 added Flash Image API.
bitmap color: argb (alpha, red, green, blue)
can apply masks

DisplacementMapFilter
ColorTransformMatrix

3d radian manipulation
3d skew

Transform matrix is very complex but very powerful.

Tons of examples with code at: reflektions.com

Tags: 3d flash flashforward2007boston

September 21, 2007

Flashforward Boston: Sound Visualization Using Flash

Rough Draft Notes

Jared Ficklin, frog design

Want to flatten learning curve, inspire with examples, remove barriers to entry, expose enabling technologies.

Sounds visualization: it is fun, enhance experience, increase usability

What is sound visualization. Standard visualization partial effects, are cool but you can do so much more. vectors and drawing, time line, interaction, sound engine, cell animation, rich media.

Sound is vibration. Author of flame sound visualization (Ruben Tube). Net result is what we consider digital music.

Sound terminology: wave length, period, amplitude, pitch, tone.

To visual: need sound and data. Sounds is easy, data has been hard. imported data: picture of the future. Marmalade FlashAmp.

frogDB WMP sound visual

native data: microphone object, SoundChannel.leftPeak & SoundChannel.rightPeak, SoundMixer.computerSpectrum(). In client and can be called dynamically.

active_mic.activityLevel (version 6 and above) between 1- 100.
SoundChannel: version 9, value between 0-1. current amplitude.
SoundMixer: version 9. 512 value byte array. waveform or FFT frequency and sampling rate. -1 to 1 waveform or 0 to 2 for frequency. 256 left next 256 right.

Be concerned about security. Security.allowDomain("*");

With the frequency output, there will be holes. bass 50-80Hz. vocals 200Hz-1000Khz. Snare. 10000 KHz to 30000KHz.

Need to think about frequency to make good sound visualization.
Multipliers, segmenting, and averaging to make the data useful.
50Hz per array value

Data stacked to the low end since that is what we hear most. Need to average samples on the high end and stretch out the lower end data to see real data.

Tactics:
direct interpolation: manipulate property, frame manipulation,
threshold spawning: values measured against a threshold
algorithmic spawning: funnest one: values processed and measured against rules
interaction: have user setup basis for visualization

self assembling music video

Tags: flash flashforward2007boston sound

Flashforward Boston: The Aesthetics of Computation

Rough Draft Notes

John Maeda

MIT Media Lab
Did a lot of old school work on a Mac

Focus on local goods. Focus on local crafts. How to marry creative folks with business outlets.

Wasn't allowed to do art. Paul Rand. ABC, Limited, Next, logos.

Media Lab. Technology lab with good branding. Muriel Cooper. Pioneer of digital graphical design space. Art director of MIT press for 30 years. Lead visual language workshop.

If you just make stuff good things will happen. Phantom relax with physical material.

Classics are waiting. Do something young. Computer is a different kind of system, it doesn't get tired.

Gone from visual range but still there on the computer. Go into infinity.

Do these things, what is it for?

program inks of page but leave it open for interaction

Inverse paint. Fixed brush, program moves.
Radial paint.
Time paint. Draw in time. Sculptural view

Reactive tools. All available on the web. Color type writer.

Tap Type Write

2001 Media Lab didn't want to run media library. Retired in 2002.

4 grad students

openstudio.media.mit.edu
interactive art studio, networked world, and how to be profitable. Creativity, collaboration, and commercialism.

opencode.media.mit.edu
Jello based processing language. All development on the web site.

E15
Take all content on the web and display it in a non browser environment. Change, modify, and organize how a user wants instead of viewing data as presented.

python code to generate 2d code onto 2d canvas. leverage ability to change things on the fly.

richer perception of time

3d browser history to view where you've been
load up a bunch of pages at once

e15.media.mit.edu (new project)

relation databases
social networking relationships
making the system easy to use

aggregating data to generate complete picture of someone online.

Tags: design flashforward2007boston visualization

September 20, 2007

Flashforward Boston: What's this button do?

Rough Draft Notes
robert hoekman, jr.

Need to get user up to speed, help to get through your application.

What's this button do?
I'm feeling lucky?

suffer from a lack of explanation, or lack of context, don't install confidence

Talking about instructive text:
Using senduit as an example. (upload file and get temporary URL for that file)
Need to communicate: purpose, benefit, usage
need to keep it short

using default value in field to prompt user
show default zip code value (5, 9, 5+4)

Squidoo (create pages to market things)
inline help balloons for instructive text

command line (something that triggers action) "call to action" verb-noun pair
people don't like object based actions "page organization"

people have gotten used to dragging, almost expect it on the web. People that have been on the web a long time might not expect drag and drop may not work. Be explicit.

once over drag, cursor changes. when dragging move other modules around to show them the change.

"I'm done editing" sense of closure

Old Version of WordPress.com page doesn't have clear way to sign-up. Links hidden in text. Redesigned to big green button (contrasting color, different background) "sign up now". Jumped up 10-12%. Instructive piece more obvious.

RSS. Most web users still don't know what RSS is. Why would a user click a button that says RSS if I have no idea what this means. "Subscribe to this blog" is a better way to approach it.

Feedburner has a good approach. Creates a stylized version of your feed. "Syndication" and "content" are stuffy words. XML is a scary word.

Addthis.com has a different approach. Easy one click subscription, but doesn't help inform a user if they don't know what RSS is.

commoncraft.com/ Screencasts are a great way to explain a concept or a new idea.

BaseCamp.com: Disposable constructive element. New page has text that goes away when user performs the action.

GoogleReader for a new user has a screencast that talks about what it does with screen shots. Put a personal face on the experience.

Software for making screencasts.
Windows: Jing, TechSmith Camtasia Studio.
Mac: Jing, SnapzProX.

Flickr and most popular tag page. Size reflects popularity. No one gets tag clouds. No real life methaphor. Big doesn't mean more popular.

LibraryThing.com "What are tags" link. Very scary tag cloud page. Information overload.

NYTimes.com has explanation of tag cloud above cloud. Still a horrible interface...

miva.org
miskeeto.com (new design firm)
updownrepeat.com (The art and science of web forms)

Q: How to capture the content scrolled off the web.
Snagit (handle captures all scrolling of the web page)

Tags: design flashforward2007boston flex

Flashforward Boston: Imagination and Technology

Rough Draft Notes

Craig Swann, CRASH!MEDIA
Chief imagination officer

interactive toy maker

not about flash or flex or as3
want to talk about ideas
R&R=R&D blurring line of work and play
happiness is fuel of creativity
work less play more
creative cross-pollination
all about changing the way you look at things, makes the things you look at change

everything is an API, HAPI, hates the word user

listen, watch, touch, sense
ambient awareness, listen 360 degrees (built-in microphone)

visualization of microphone input, how it plays into environment design. Line in audio and.
kaleidescope video example, stop video example triggered on sound

speech recognition

watch (like a computer with a set of eyes)
motion threshold (detecting presence)

more about the idea dn how to interact with the computer.
userface (computer vision)

video difference visualization to show motion

motion mapping example, going beyond simple interactivity.

gesture based interface.

color tracking.

how to simulate mutli-touch
multi color tracking color mixing interface

time delay video across a grid
line based video delay

how to control time through the interface
video displacement of time, linear record and playback versus real-time

physical realm
IPAC (USB)
wind chimes are constantly touching tie to sound samples, virtual wind chimes
lock that can be wired up (physical control)
rings on fingers connected to wires, contact with thumb, 8 connection gives a scale
conductive paint and pencil to create interface

painting with light: litegraf
ipac on painters palette plugged into computer

many forms of control, make controller, arduino
light sensor and cover it, phidgetRFID
radio control car controller to remotely control flash

SMS sudden motion sensors
using accelerometers for physical version of breakout

monome
OSC (way to get data into flash)

midi controller

wii interface to flash and ability to play with it

try something different today

Tags: flash flashforward2007boston video

Flashfoward Boston: Designers vs. Developers: How To Avoid Fights on the Playground

Rough Draft Notes

Marc Leuchner, Almighty
Matt Wright, ROKKAN

Everyone is working together to make projects happen. Most common sense but people aren't really calling it out.

Industry overview: Best area related to Internet. Unique people, extremely creative, lots of technologies continually expanding. FWA tracking latest and greatest. newstoday.com, Communication Arts Magazine.

Subcultures: code fiends, design junkies, framework freaks, application addicts, game gurus, usability nuts.

In larger companies: role strictly defined, objective, performance, but hard to communicate. While in a small company: roles loosely defined, absorb responsibilities, easier communication.

Can people work together? Yes if we talk and compromise.

Look at current workflow. If it is working, maybe you don't need to change anything. Some areas could be improved, need to really pinpoint weaknesses and admit your faults. Focus on opportunities to collaborate.

Education is key to working together. Need to educate each other about what you do and why it matters.

Some people don't want to change (don't force it), start with something fun. You will probably fail a few times but learn from your mistakes.

Designers: should ask for help with programming tasks to get into it more.
Developers need help with: UI design, typography, color theory, photoshop.

Brainstorming: invite everyone, technology can drive ideas, PM as moderators, open mind (no egos).

Creative Development: narrow ideas, define technologies. Need to be as clear as possible and justify. Talk about why a technology is good/bad, don't throw around buzzwords, stay open minded. Last time to argue.

Information Architecture: Don't work in a vacuum, avoid nonobjective views, run ideas by developers, keep yourself in check.

Art Direction & Design: Need prototypes, solicit developer feedback, might need to sell your idea, may require longer design.

Production and Development: After hand-off check in frequently, nit-picking is okay, way to get back to idea since translation to code may have lost something. Pixel perfect isn't always possible. Motion comps are helpful and remember that some compromise maybe needed.

Testing & QA: Not just for developers, learning experience, help prevent future issues

Project Review: discuss positives and what went wrong.

Workflow: Layer comps, motion samples, functional specs, Flex skins, separate style information, consistent folder structure.

Ted Patrick has some good articles on skinning Flex components.

Breaking communication barrier: active early communication helps build trust, respect and learn about everyone's role, don't be afraid to ask questions. Keep an open mind. Don't build barriers creates clicks and makes it hard to cross the bridge.

Middle Man: Hard to find but good for bridging the gap.

Deadlines = stress = fights. It is unavoidable but strive to work together.

nobien.net

Tags: flash flashforward2007boston flex

Flashforward Boston: Stylizing Flex Applications

Rough Draft of Notes

Joey Lott The Morphic Group

Main application to be styled is just using standard components. VBox, List,

Inline attribute on List: backgroundColor
This isn't preferred since you have no centralized location of what your style information is.

Adding . Type selector and Class selector.

<mx:Style>
List {
    backgroundColor: #0000FF;
}
</mx:Style>

Applies to all components. Another List in the program would also get it. To have more control you can use a style selector. Need to set it via styleName on a target component.

.exampleStyleSelector {
    backgroundColor: #0000FF;
}

Why do this. Can reuse selector on any other component while keeping the style information centralized. Camel case for style names or hyphenation. Inline styles must use camel case but CSS information can use either.

Moving selector into external styles.css file via:

<mx:Style source="styles.css"/>

Application {
    background-color: #000000;
}

Precedence of style application: Type selector applied first, then class selector, lastly inline style attribute.

What to style items in the List. Going to use an item renderer. Like Cell renderer in Flash. Using another MXML component to show the list item. Gets passed a data property which contains the list item.

<mx:HBox>
<mx:Image source="{data.image}"/>
<mx:Text text="{data.title}"/>
</mx:HBox>

Add itemRenderer="com.example.DataRenderer" to List we want to render items of. Always need to use full class name can't use class name only even if imported.

Style scrollbars with a type selector. It is using custom images for arrows.

ScrollBar {
    up-arrow-up-skin: Embed('images/scrollArrowUp.png');
}

Embedding fonts can use url or local directive can be used to reference font file.

@font-face {
    src: url("Verdana.ttf");
    font-family: Morphic;
}

Styling some of the other components. Some type selectors can reference other class selector names.

TabNavigator {
    tab-style-name: tabButtons
}
.tabButtons {}

VBox with nested image. Using scale 9 to control embedded image.

.framedImage {
    background-image: Embed('image.png', scaleGridTop=30, scaleGridBottom=59, scaleGridLeft=30, scaleGridRight=59);
}

Programmatic skinning. Consider a general style that you want to have many variations of. Graphic assets would require unique file for each variation and increase file size. A programmatic skin let's you do it in code instead.

public class ButtonSkin extends ProgrammaticSkin {
    // key method to override
    override protected function updateDisplayList(...);
    if (getStyle("backgroundColor") != null) {
        //pikcup value
    }
    // name property of programmatic skin
    if (name == "upSkin") {
        //skin specific style
    }
}

// in css
Button {
    upSkin: ClassReference("com.example.ButtonSkin");
}

Customizing the preloader. Make sure you only use ActionScript stuff, nothing from Flex framework since they won't be available yet.

public class CustomDownloadProgress extends DownloadProgressBar {
    override public function set preloader(value:Sprite):void {
        // progress and init_complete events
    }
    // dispatch complete event when done and application should start
}

<mx:Application preloader="com.example.CustomDownloadProgress"/>

scale9.com for premade styles

Tags: css flashforward2007boston flex styling

September 19, 2007

Flashforward Boston: Designing with Sound

Rough draft of notes

Dave Schroeder, pilotvibe.

Sound is a powerful communicator
Sometimes more powerful than visual and can be misused

Design is about seeing what isn't there as much about as what is there. Design is inventive and reductive. Sound design can be dangerous.

Sound design: Voice over, sound effects, navigation sounds, ambiance, music.
Visual story-telling: on screen, off screen, non-digetic (out of story space).
Sound relationship: sympathetic, contrasting, abstract/emotive. Bad day movie clip shown with 3 different sound tracks. showing each relationship.

How plan audio in interactive. Goal of audio, time & budget, mission statement + asset list, reference points hard to talk about sound (almost like a foreign language).

  1. music
  2. voice over
  3. ambience
  4. navSounds
  5. sound effects

Working with sound.
Music: focus on mood versus genre, creates singular/linear space, it can convey abstract things. Tempo and complexity. May focus your attention.

Voice overs: pro talent, one file = one thought, location recording (consistent background noise), inflection. Record some quick / fast and make sure it works before doing it all.

Ambiance: complete the picture, hard to find the perfect loop (build with layers instead), only need essential sonic cues. Non routine sounds can't loop. Speaking, accidents, etc.

Navigation Sounds: help user navigate and explore, focus attention on visuals, meaning derived from relationship with sound, reinforces communication goal.

Same sonic space (wet & dry sound). Reverb (delay) does a lot, helps to locate and place objects. EQ helps with that. Easier to make a dry sound wet.

Spatial sound: x: balance/pan, rising less low end, moving away less high end

Audio editing: Likes Pro Tools, important to input/export .wav, .aiff, .mp3, record to wav, high quality master files, import movies to work against

Tracks: 4 tracks of playback, separate tracks fof VOs/effects, layer sounds to ceate sounds, mock up a sound scheme.

MP3: compression is hard. Use EQ to shave off the top freqs. length is important, trim tight, respect tails. 80kpbs or higher is great, but be consistent.

Pro Tools example. Cut in middle drag end to beginning and overlap in middle with cross fade. Easier way to make a good loop.

Voice overs: Find highest peak across all files and make it louder. Normalize across all takes.

Tags: flash flashforward2007boston sound

Flashforward Boston: Usability Approach to Accessibility

Rough draft of notes

Niqui Merret

Audience poll: Some people have done accessibility testing, but most have mot done so with disabled users.

Need to understand your users.

Accessibility is for everyone vs. technology or device. Focus on users with disabilities.

Accessibility in the real world, no technology is 100% accessible to all users. Aim to achieve best solution, maybe multiple technologies are needed. Combine Flash and HTML.

Definition of Accessible: To be able to be accessed. Want to break down barriers to accessing information.

Two main barriers:
Controls outside of Flash control: no tabbing between Flash and HTML site, wmode setting issues along with MSAA issues, MSAA didn't work with prior versions of Flash player, can't tell screen reader "I've made an update", can't set reading order on static textfields, Flash doesn't support voice over on Mac, Flash doesn't take high contrast settings on Windows.

Content and presentation barriers: stuff we build in that we need to think about (not everything needs to be accessible). Understand where the user is coming from. Screen reader users probably can't use mouse, need keyboard control.

Disability categories (these are all muddy and shouldn't be a taken as hard and fast):
visual (color blindness biggest issue), audio, motor, cognitive (good understand, foreign language).

Legal and General UK case study of accessibility and ROI.

Color and contrast (don't care about colors, need to distinguish content). Showing contrast demo with memoriaduo.com. Mac system settings has built in contrast control. Some tools available on other platforms. Don't talk about a color without a non-color cue ("Click on the green button") Provide tools to switch within your application if possible.

Size: Provide mens of controlling font size.

Keyboard Access: Provide logical structure. Flash accessibility dialog (easily set tab index). Focus highlighting is important if you have keyboard controls. Shortcuts make sense if someone is going to be using the site multiple times. Non visual users need to have them explained.

Audio: Provide textual or graphics of audio information. Using weebls-stuff.com videoas an example. Text on screen of audio lyrics. Harry Potter website is another good example.

Screen reader access: Auto next doesn't force update. Yahoo developer network has videos about screen readers and explanations from blind users and screen magnifier example. Set the name of buttons for non text buttons. Flash auto labels textual buttons. Specify reading order (tab index). Avoid using wmode.

Demo of Inspect tool part of Microsoft accessibility suite to show what is being sent to screen.

swffix.org Going to be best embedding technique, currently in public Alpha. Will replace SWFObject and UFO joint project.

http://www.adobe.com/accessibility/

http://blogs.adobe.com/accessibility/

How big is big enough for font size: Niqui recommends minimum of 11 or 12 for Arial. Font and context specific.

Standalone player and AIR don't communicate with MSAA.

Flash vs. AJAX accessibility. Flash is more accessible by default. osflash.org has AJAX aid which detects virtual buffer refresh. Easier to control visual output (contrast, fonts, etc.) in Flash.

Flash components can destroy tab ordering. Something on stage that that isn't labeled will throw off tab order. Best to set tab enabled to false.

Tags: accessibility flash flashforward2007boston

Flashforward Boston: SWX

Rough draft of notes

Aral Balkan is talking about SWX.

Some post lunch jumping to capture a room of a full of people in the air yelling SWX.

Aral likes to consult, speak, and teach about user experience design, development processes, and software architecture. Works primarily with Flash, Flex, and a focus on open source. Founded osflash.org. Currently working on SWX.

What is SWX: new and native data format for Flash platform. Like JSON which is data in JavaScript. SWF is the native format for Flash. Want to put data in a SWF.

Terms:
SWX: Native format for Flash.
SWX RPC: RPC protocol encoded in SWX.
SWX PHP: PHP backend for SWX.
SWX Tools: Service Expolkire
SWX AS Lib: Optional, high-level AS library that handles SWX RPC calls.
SWX APIS: APIS for Flickr, Twitter
Public gateway: Open SWX RPC endpoint

Why SWX: Issue with existing data formats.
loadVars, loadVariables: deserializing string is complicated, it's plumbing, should be handled for you
XML: What data structure is being loaded, first child, last first, what child
Remoting: Created SWX because of remoting. Go to Adobe and search for remoting classes. Barrier of entry is too high. Doesn't work with Flash Lite.

SWX just works. SWX is easy. swxformat.org
Demo of Services Explorer: Test services installation of PHP SWX Services.

Launch Data Analyzer, Launch Flash, AS 2 FLA: Create MovieClip named loader, In actions panel:

loader.serviceClass = "Flickr";
loader.method = "swxPhotosGetRecent";
loader.debug = true;
loader.loadMovie("http://swxformat.org/php/swx.php", "GET");

Data Analyzer has data that was returned. Creating second MovieClip called image:

// hack to get things up and running, see if it works
function onEnterFrame()
{
    if (loader.result)
    {
        image.loadMovie(loader.result.photo[0].src);
        onEnterFrame = null;
    }
}

swxformat.org/faq/ for information about Flash IDE Sandbox warning issue

swxformat.org/download (SWX ActionScript library) comes with classes and examples.

import org.swxformat.SWX;

var swx:SWX = new SWX();
swx.gateway = "http://swxformat.org/php/swx.php";
swx.debug = true;
// got rid of loader MovieClip
var callParameters:Object =
{
    serviceClass: "Flickr",
    method : "swxPhotosGetRecent",
    result: [this, resultHandler]
}
swx.call(callParameters);
function resultHandler(event:Object)
{
    trace("Hello");
    var imageSrc:String = event.result.photo[0].src;
    image.loadMovie(imageSrc);
}

Currently this only works with AS2.

How to create your own service side class. SWX MAMP Bundle to work with PHP on a Mac allows working with things easily. One click run on Mac, just download ZIP for Windows or Linux if you have a running web server with PHP.

HighScores.php SWX services example

<?php
class HighScores
{
    function getNames()
    {
        return array('Branden', 'Mario', 'Chafic');
    }
}
?>

Changing example from above:

swx.gateway = "http://localhost:8888/phph/swx.php";
serviceClass: "HighScores",
method: "getNames",

// updated resultHandler

var names:Array = event.result;
for (var i=0; i < names.length; i++)
{
display.text += names[i];
}

TextField component called display

FlashLite 2.0 and 2.1 are supported.

Showing demo of miniflickr using CS3. Trying to demo it on his Nokia N95 (couldn't get network).

Showing application with SWX that pulls Twitter data.

SWX Ruby (Locomotive one click Mac installer for Ruby)
creating swxrpc ruby application. Line of code to install SWX Ruby.
Showing example using Ruby service, same loader calls.

SWX uses: Mashups for Flickr, Twitter, Jaiku, Numpa, Nabaztag, etc.
Flickr API: current, MIT license, upload, actively maintained

Mobile applications: Limitations no POST. DeviceCentral doesn't support LocalConnection.

Games, Kiosks, CDs, Wrap it with AIR (Twimpa is an example)

SWX has a showcase on swxformat.org

AS2, Flash 6+, Flash Lite 2.0, 2.1 Mobiles, Wii, PS3, PSP, Chumby

Soon: AS3/Flash 9

Roadmap: Writting RFCs for SWX and SWX RPC, bundles for other platforms, more APIs.

nabaztag.com

Tags: flash flashforward2007boston swx

Flashforward Boston Talk Time Change: Automation of Flex Building and Unit Testing

Due to a scheduling conflict the time of my talk has been moved up a slot. The new details: Grand Ballroom, Salon E: Friday, September 21, 2007 1:30 PM-2:45 PM.

Tags: ant antennae flashforward2007boston flex flexunit

Flashforward Boston: Keynote

Rough draft of notes

Flickr tag with flashforward


Kevin Lynch from Adobe

Pushing Flash forward with AS3. Complimentary copies of Essential ActionScript 3.0.

With FP9 and AS3: E4X, regular expressions, strong and lose typing.

Inside Tamarin is the Virtual Machine within FP9. Core of VM has been opened sourced to Mozilla. 10 times speedup in FP9. Also have this is as the scripting language for the web. FireFox and Flash Player 9. ECMAScript standard. Includes Just-in-Time compiler.

Showing RSS XML data and E4X possibilities:

feed.channel.title.text()
feed..title.text()
feed..item[1].text()
feed..item.(@id =="82").title.text()

Power of regular expression.

Showing comparison of AS3 and JavaScript 1.7. In general 10 times faster.

Flash Player adoption. Fp7 70% in 1 year, FP 8, almost 90% in one year, FP 9 90% in one year.

Picnik. Online photo editing. Zoom, rotate, alignment, color editing (saturation, temperature), sharpness, real-time editing.


Joshua Hirsch from Big Shapeship (Digital Creative Agency) talking about HBO.

8 apartments single building, like no walls. Projected onto side of building. Watch on-demand on digital cable. Also put the web.

HBO Voyeur. Using papervision for 3d effects. Full video.


Kevin: Adobe is focusing on digital technologies. Video workflow from creation to distribution. Adobe media player to view video on desktop.

H.264, multi-core cpu, full screen hardware scaling, bitmap downscaling, secured delivery of streaming video. IPv6, ISO video standard video camera, personal media players, set-top boxes, tvs. FP9 being updated to include H.264 code named Moviestar.

HD Video Demo. Releasing soon, new component for CS3 to use H.264 right in Flash. CSI HD video example. 70% of web video is in Flash.

Papervision example with multi-core speedup.


Adrian Ludwig talking about Flex. Already two versions of Flex. Currently working on Moxie. Language intelligence, profiler, visualization, workflow.

Flex is moving to be open source. bugs.adobe.com. Profiler demonstration. Memory usage. Object creations. Snapshot of application. Application is running faster than he expected (had to muck code). Zoom in on method that is taking a long time. Who was calling.

Showing refactoring example. Method rename. Workflow speedup.Sample application is using charting controls. Advanced data grid, has per column formatting.

Flex perceived as too big. Flex framework cache. Download framework code only once.


Kevin back talking about AIR. Flash, PDF, and HTML. AIR platform overview.

AIR sample applications. AIR Samples.
Showing badge install process. One click to install AIR and your application. PixelPerfect example.

artMusheen. Paint with shapes example. Native chrome.

digimix, mixing audio.

Finetune. Streaming music on your desktop.

Buzzword. Word processor. Edit locally or shared thorugh a cloud. Lists, tables, pictures, graphic editing. No drag'n'drop support out of the box yet.

Flickair searches Flickr for photos, nice chromeless application.

adobe.com/go/air

CS3 extension for Flash to just package application as AIR, should just work.

Tags: air flash flashforward2007boston flex

August 31, 2007

Flex Automation Links

If you are interested in using the Flex automation features, this is a collection of links which might be helpful:

Tags: automation flex

August 26, 2007

on AIR Bus Tour Boston: Summary

On Friday I attended the on AIR bus tour in Boston. It was a free one day conference primarily sponsored by Adobe. The conference focused on getting people introduced to the AIR platform. While I was already familiar with most of AIR's capabilities I thought it would be a good opportunity to network with other Boston developers and meet a bunch of people from Adobe.

Continue reading "on AIR Bus Tour Boston: Summary" »

Tags: air flex onair2007boston

August 24, 2007

on AIR Bus Tour Boston: Quick Demos

The last session was a collection of quick demos from the speakers and audience members. My apologies in advance if I missed your contact information.

Todd Prekaski (audience): Demoed a photo album builder application. Allows pulling in pictures from the local file system. Has some integration with Flickr and zoomr (wasn't completely clear on what that functionality was). Has random photo placement mode for viewing a collection of pictures. Has ability to email collection to contacts. Hopes to add online synchronization to pull down additional image presentation components (stylized borders, filters, etc.). Tool also supports photo resizing, rotation, and other simple effects.


Daniel Dura: TwitterAIRCamp is a way to do a nice public presentation of Twitter data. If you want to get in on the fun onairbustour is the Twitter name.

Salsa created by Christian Cantrell. Application that does drag and drop file uploading/downloading to Amazon S3.


Johnny Boursiquot (audience) from Pier: Business value calculator being used by companies like HP. Goal is to make sales people mobile and allow offline ROI value calculations. It uses Flex charts, graphs, and HTML output (will switch to PDF when supported). Took approach of what is the business value of AIR. Primary reasons for going with the platform included: way to extend backend service onto the desktop, easy to update, and online integration allows robust security model.


Kevin Hoyt demoed some more applications from Adobe labs. He created an AIR version of MapCache. Allows saving maps, copy to clipboard, and drag and drop. Rendering an HTML version. Mentioned source is on his site.

Geocode allowing geo tagging an image by dragging it onto the map. Still working on this application. Again an HTML/JavaScript application. It handles such activities as copying images, extracting thumbnails, and displaying the images in the UI. Makes heavy use of asynchronous events to do it on the fly without hanging the UI.

Kevin also ported a version of Ted Patrick's AIR Chat to HTML/JavaScript. The application uses Amazon EC2, running Python socket server, to provide simple chat services. The port uses the Ext JS Framework. HTML version is not posted yet.


Mike Chambers: Is a World of Warcraft player and uses Wowhead to track game information. Wrote an AIR wrapper around Wowhead. It is an always on top window that allows typing in a search term and launching the results in a browser window.

Hubble: Geo tagging image uploader for Flickr. Shows where images are located on the map. Nice UI to geo tag and upload. Can drag image onto map to tag it with drop location. He mentioned that the application is fairly buggy right now.

GeoPlotter: Show a Yahoo map and you can plot any latitude longitude pair on the map. Supports ability to drag a data file of way points and plot them all on the map. Most of his code is on Google code.

Ascension: One of the first AIR applications. It is an MP3 player and way to explore your music. Supports importing your music from iTunes, grabbing album art of Amazon, and displaying lyrics from lyricwiki. Has ability to display a slide show of images from Flickr that match the artist's name.

Tags: air flex html javascript onair2007boston

on AIR Bus Tour Boston: Taking apart the bus

Mike Chambers gave a talk about some of the technology being used on the tour bus. Using AIR applications to help track the location, what is going on, and display the information on the web.

Code for all the applications is available from Google code.

AIRTracker: Application that gets GPS info periodically and posts it to the server. The AIR application is passed the GPS coordinates via command line arguments. Uses a program called GPSBabel to get the GPS information. Command line arguments are handled through an invoke event.

Shell.shell.addEventListener(InvokeEvent.EVENT, handler);

If your application is already running, the handler will get called again with the new arguments. The application queues up GPS point data to handle server up/down and connection online/offline. Stores them in a local file using binary serialization of the AS3 array. It waits for ACK from server before removing data from the array. In order to serialize the custom class in the array you need to add metadata to the class.

[RemoteClass(alias="com.adobe.onair.geo.GeoPoint")]

He pointed out that there is no compile time checking so you could type the class name wrong. Showed an example using SocketMonitor to do a low level check for connectivity. The application demonstrates a common pattern of queuing and saving data locally and pushing the data up to server as connectivity is available. Handles both connectivity issues and application crashes. Shows a good robust application. Application and server interaction is easy since there is a single source of data which removes the need to handle conflict resolution.

He next showed pictures of the hardware on the bus. The hardware for grabbing the GPS coordinates was a Garmin GPS 18, which is a hockey puck sized device that attaches to the top of your vehicle.

AIRSnapshot: Application that every minute takes a picture (JPG format), geo encodes it, and uploads it to Flickr with appropriate tags. Application shows handling bigger data and multiple queues. It has to go to the server twice, first to upload the picture and a second time to add the geo tags.

flump: Application that downloads all of your raw Flickr images. Used this to pull all of the pictures from the bus and put them together into a movie available on The Flex Blog.

Audience asked about using AIR to broadcast a live video stream, which sounded like it was possible.

Tags: air flex onair2007boston

on AIR Bus Tour Boston: AJAX in AIR

Andre Charland from Nitobi gave a talk about AJAX in AIR.

Why is AJAX in Air a good thing: code reuse, skills reuse, HTML is really good at some things, and maintaining existing UI patterns.

He talked about the benefits AIR gives over browser. This was a quick rehash of the list from the AIR API overview.

He showed an AJAX Fisheye Menu Example. Demonstrated that the same AJAX code works in a browser as in an AIR application, very little code shown.

Offline Saleforce.com demo. Showing online/offline sync capabilities. No code shown.

MultiVista: Construction document management application. Showed dragging and droping pictures from desktop into application as an alternative to uploading through a browser dialog. Directory scan to keep folders in sync. No code shown.

Tags: air ajax onair2007boston

on AIR Bus Tour Boston: AIR and Flash Video in 20 minutes

Thierry Curis from Akami gave a talk about using Flash Video in AIR.

Akami is creating an open source connection class (main site) that is robust, lightweight, and flexible, with credits to Will Law. Pure AS3 code. Setup to handle on demand content and protocol detection.

He gave a demo using the AkamaiConnection class to show streaming content. Some sample code is below. The complete source is available.

public function init():void {
    var ak:AkamaiConnection = new AkamaiConnection();

    // Some of the setup properties
    ak.createStream = true;
    ak.maxBufferLength = 5;
    ak.useFastStartBuffer = true;

    // Some of the events

    // handle connecting to the content
    ak.addEventListener(AkamaiNotificationEvent.CONNECTED, connectedHandler);
    // handle network connection going online/offline
    ak.addEventListener(AkamaiStatusEvent.NETCONNECTION, netStatusHandler);
    // know when the length of the stream becomes available
    // read it through the ak.streamLength property
    ak.addEventListener(AkamaiNotificationEvent.STREAM_LENGTH, streamLengthHandler);

    // where the stream is located
    ak.connect("hostname");
}

public function connectedHandler(event:AkamaiNotificationEvent):void
{
    var video:Video = new Video();
    video.attachNetStream(ak.netStream);
    ak.requestStreamLength("filename");
}

// once enough content has streamed
ak.play("filename");

// methods to control the playback
ak.resume();
ak.pause();
ak.seek(#);

Tags: air flex onair2007boston video

on AIR Bus Tour Boston: AIR API Overview

Daniel Dura gave an overview of the AIR APIs.

Air provides a rich stack of APIs that is available to both Flash/Flex and HTML and runs on multiple platforms. These APIs cover: network detection, file I/O, custom window chrome, multiple windows, native menus, drag and drop with clipboard, system tray and dock notifications, application signing, application icons, file type registration, background applications, application updates, and network support.

He next drilled into some of the above areas in more detail. AIR specific classes are included in the Flex 3 documentation available on LiveDocs.

Windowing: Multiple window support, transparent windows, different window types (lightweight, utility, and standard), z-index ordering, and always in front.

Pixel Perfect: Alpha window overlay that shows width and height with no standard window chrome.

HTML Control: Integrated into Flash rendering pipeline (can apply effects to it), script bridging, and override default behavior (navigate, history, window, resize).

File I/O: Full read/write access, native file dialogs (save, select, select multiple, directory), and Async and Sync APIs.

Database: SQLite embedded database, zero setup, single file, and based on SQL92.

Drag and Drop/Clipboard: System level drag and drop (AIR to AIR, AIR to OS, OS to AIR, etc.), multiple formats (URL, files, text, serialized AS objects), and modifiers (link, copy, move). Drag and drop is handled through TransferableData objects.

Application Icons: No feed to know about icon format, can just supply PNG images.

Service Monitoring: Monitor network interface changes, monitor services, and extensible (supports multiple service types). URLMonitor class is one example.

Flex Builder: Debugging, code hinting, packaging, and application signing.

Tags: air flex onair2007boston

on AIR Bus Tour Boston: Yahoo and Adobe AIR

j r conlin gave a talk about What can Yahoo! Do For You?

Yahoo Developer Network provides lots of tools, largely free to use, with Flash/Flex specific content. These include: Maps, Search, YUI, Flickr, del.icio.us, Upcoming, Pipes, MyBlogLog, BBAuth, YSlow, Astra, etc.

YUI: Lots of widgets that you don't have to build. Calender, grid, etc.

Pipes: RSS type mashup capabilities for non programmers.

AirMail: Drag and drop mail application written in AIR (not public yet).

Astra: YUI for Flex developers, BSD style license.

Tags: air flex onair2007boston yahoo

on AIR Bus Tour Boston: Native Windows

Chafic Kzoun gave a talk about how to use Native Windows with AIR.

He showed a bunch of simple examples which demonstrated the native window capabilities in AIR. Best was a screen size tester called PixelPerfect available from Adobe Labs.

NativeWindow is the core of what you will work with. Keep in mind Window is also just a class. Some options need to be setup before the window is created, while others are runtime properties. This is why the AIR application descriptor forces you to specify certain options.

// Create a simple utility window and display it
var options:NativeWindowInitOptions = new NativeWindowInitOptions();
options.type = NativeWindowType.UTILITY;
var nativeWindow:NativeWindow = new NativeWindow(true, options);
nativeWindow.activate();

A more complex example that uses more options.

package com.example {
    import flash.display.NativeWindow;
    import flash.display.NativeWindowInitOptions;
    import flash.display.NativeWindowSystemChrome;

    public class StandardWindow extends NativeWindow {
        public function StandardWindow() {
            var options:NativeWindowInitOptions = new NativeWindowInitOptions();
            options.systemChrome = NativeWindowSystemChrome.STANDARD;
            options.maximizable = true;
            options.minimizable = true;
            super(true, options);

            alwaysInFront = true;
            title = "Custom NativeWindow";
        }
    }
}

Many options available with the NativeWindow API, best to look at the documentation. "bounds" gives you lots of flexibility. Lots of good events (resize, move, moving, etc.)

The Window component is a wrapper around the NativeWindow. Flex provides an out of the box chrome with standard minimize, maximize, and close buttons and adds a status bar. Can be easily used in MXML. Use open() after creating the instance instead of activate() like you would with a NativeWindow. The showFlexChrome Window attribute can turn off the default Flex chrome. The Window class also provides access to the native window through its nativeWindow property.

<?xml version="1.0" encoding="utf-8"?>
<mx:Window xmlns:mx="http://www.adobe.com/2006/mxml"
systemChrome="none" showFlexChrome="true" showStatusBar="false" transparent="true">
</mx:Window>

The Screen singleton gives you access to information about the users' monitors. Has support for multiple displays along with supplying sizes and capabilities. Screen.mainScreen.visibleBounds will return visual area that is available taking into account task bar or dock (doesn't look like this is working in the current AIR beta on the Mac).

The Flash CS3 AIR update allows you to export and run your Flash application as an AIR application.

Tags: air cs3 flex onair2007boston

on AIR Bus Tour Boston: Business Class AIR

Charles Freedman gave a couple of demos for Saleforce.com and Ribbit.

Salesforce.com

Salesforce provides a set of AIR specific classes to ease creating RIAs which leverage the data in Salesforce. AIRConnection.as is the main class which provides a layer between Flex and the AIR database which is based on SQLite. Looks like registration is required to get access to the toolkit.

Showed an example of how to use the AIR URLMonitor class to detect online and offline status. When online the sample application pulls data from the online database and caches it locally. Can then run queries against it and queue updates while offline.

Ribbit

Fully functional Flex based phone that allows adding telephony to any web page. Online version allows you to listen and read voice mail (they do some speech recognition). The AIR application downloads your call history to allow displaying it offline. Didn't feel like a convincing use of an offline application since it didn't look like it cached voicemail (even the transcribed version). He gave a live demonstration of calling someone in the audience.

developer.ribbit.com has developer tools.

Tags: air flex onair2007boston

on AIR Bus Tour Boston: ActionScript and JavaScript Integration

Kevin Hoyt is back with a second talk about how to integrate ActionScript with JavaScript within a single AIR application. Currently on the web you have an HTML page and throw in an embed to display some video, but it is a black box. Likewise a Flash application is mostly not interacting with HTML at all. Script bridging is the magic that makes it all possible.

He showed a simple Flex application with a location field that loads and displays an HTML page within AIR. Currently AIR can't display Flash embedded in an HTML page that it is rendering. That should be supported in a later beta.

AIR has a Flex tag called which can render HTML content. Primary use is to set the location property, which will load and display the URL given. He showed an AIR HTML "Browser" in 5 lines of MXML code:

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
<mx:TextInput id="input" enter="web.location = input.text;"/>
<mx:HTML id="web" width="100%" height="100%"/>
</mx:WindowedApplication>

In ActionScript you have full access to the HTML object and through it access to all JavaScript like functions such as getElementById. To read an HTML value in ActionScript:

// Read an HTML text field
var name:Object = web.javaScriptDocument.getElementById('txtName').value;
// Update an HTML text field
web.javaScriptDocument.getElementById('txtName').value = "text";

Data comes back as a JavaScript String, which doesn't map directly to an ActionScript String. The returned value should be stored as an Object. He didn't mention about gotchas when going in the other direction.

Next he showed how to use native drag and drop. The example took a desktop image and droped it on the Flex application. NativeDragEvent and friends let you handle the drag and drop. Once the Flex application got the image, it introspected the HTML and replaced all images in the rendered web page with the dropped in image.

The next example showed how JavaScript can leverage and manipulate ActionScript. JavaScript developers should consult the Flex 3 SDK documentation to know what is available and what packages the classes are in.

The application's back story is about wanting to display the user's version of an icon for a specific file extension. Showing a sample from the core in the Aptana (source available) that knows how to determine and show the custom icons. OS returns an Array of different icons. The example uses PNGEncoder in ActionScript to render the information. HTML can include ActionScript libraries by specifying the SWF as the script source.

<script src="library.swf"></script>

The last example was showing that HTML rendered in AIR can be manipulated by Flash. It loaded a simple HTML page and then applied Flash filters to various divs. Really cool capability. No source shown.

Tags: air flex html javascript onair2007boston

on AIR Bus Tour Boston: Building AIR with HTML and JavaScript

Kevin Hoyt gave a talk about how to use the AIR SDK to develop an AIR application using HTML and JavaScript.

The AIR SDK includes:
Binaries:
adl: Launcher for AIR applications
adt: Packager for AIR applications

Frameworks:
AIR Aliases: shortcuts for HTML development
Service Monitor: ability to detect if you are online or offline

Application descriptor template, code samples, and badge packager and source are also included. Currently 4 clicks to install and launch an application from a website using the badge process.

HTML Main Application:
He created a standard HTML file and saved it as index.html (not a requirement to be named index.html).

From a terminal running the adl command with -help will give you information on the command line syntax. Besides launching your application, adl can also pass command line arguments into your application.

He created an application descriptor from the template. Import difference from the Flex example was to set the rootContent to index.html. Descriptor also supports fileTypes which lets you associate a file extension with your application.

WebKit will include CSS3 support.

DreamWeaver has extensions that suppy AIR capabilities. Can launch applications and edit descriptors from within DreamWeaver.

He added an HTML text form field and button. Created an event listener which is registered as part of a body onLoad function. The first version of the event listener function popped up an alert to test that everything was working. Next he pulled the text form value out and saved it to disk.

In JavaScript, the rough code is:

var file = window.runtime.flash.filesystem.File.desktopDirectory.resolve('boston.txt');

// If you include AIRAliases.js this can be shortened to
var file = air.File.desktopDirectory.resolve('boston.txt');

// Now that we have a file reference:
var stream = new air.FileStream();
stream.open(file, air.FileMode.WRITE);
stream.writeMultiByte("text", air.File.systemCharset);
stream.close();

The AIR API also has support to read and write in an asynchronous mode using events.

Aptana: Open Source Eclipse IDE for JavaScript/HTML development and debugging. Includes built in support to run and package AIR applications. Best part is the sample applications that come bundled with it. Meebo directory includes custom HTML chrome application example.

Tags: air html javascript onair2007boston

on AIR Bus Tour Boston: Introduction to Adobe AIR with Flex

Mike Chambers gave a presentation about building your first Adobe AIR application with Flex.

A quick poll of the audience showed about 60% of the audience develops with Flex/Flash and 40% develops with HTML/ColdFusion/PHP.

For the demonstration he used the Flex Builder 3 Beta to create a sample application. This version has native support for AIR applications. You can extend the beta by using your Flex Builder 2 license key.

There is an included Flex AIR project wizard. Creates an Application.mxml (Flex Code) and Application-app.xml (metadata) file in your project.

The Metadata file is well commented, but he called out certain values:
appId: Used to distinguish each application, only used internally by the installer process. Next beta will using code signing to handle identifying applications.

name: Application name as it is displayed to the user and used by the OS to display the application in the process viewer, etc.

title and description: Name and description shown in the AIR installer.

rootContent: Most important tag. Defines what and how your application gets launched. "systemChrome" is standard or none, it toggles native window chroming. "transparent" determines if the background of the application is rendered or not (use this to create non standard chrome). "visible" determines if your application is visible when it launches. Flex Builder has special syntax for the rootContent text, but in most cases it points at your Application.mxml.

The main application code works like a standard Flex application:
Using design view he quickly threw together the application. In this case it was just a simple button. Primary change for a standard Flex application is that the root MXML tag is WindowedApplication instead of Application. WindowedApplication gives access to native window APIs. With Flex Builder you can easily run and/or debug your AIR application. The work flow is similar to a Flex application.

Packaging your application:
Badge based install process which can install both the runtime and your application all through a single website click. Flex Builder includes the ability to export your code as an AIR application. Dialog lets you select which files get included. Currently there are some cryptic errors when you don't include required files which should be fixed by the next beta.

In descriptor file you can specify application icons:
Give AIR an PNG file for your application and it will handle making it work on all the different platforms. Back in the metadata file uncomment the icon block and set just the 128x128 icon and the others are taken care of. Icons aren't required, but they add polish.

Doubling clicking exported .air file launches the installer. Still tweaking install dialogs. Under the hood it sets up everything needed to run the application. On Mac it gets installed into the user's application directory (this may change). Looks and acts like a native application.

Other Resources:
Apollo for Flex Developers Pocket Guide: Released under Creative Commons License.

Adobe Integrated Runtime (AIR) for JavaScript Developers: Released under Creative Commons License.

adobe.com/go/air/: Best link to get started.

onair.adobe.com: All of the sessions from the tour are online in video format (recorded at various stops along the tour). Code created on the bus is available on Google code including media assets. They are also publishing different data feeds that people can play with.

Tags: air flex onair2007boston

on AIR Bus Tour Boston: Keynote

Ryan Stewart gave the keynote as part of the on AIR Bus Tour here in Boston.

Adobe has primarily become a web company. Flash penetration is happening quickly, Flex is gaining ground, and other standards like PDF are being used everywhere.

Adobe has lately been focusing on: Runtime Performance (AVM2 and AS3), Development Model (Flex and Flex Builder), and Desktop Runtime (AIR). I'd also add that the CS3 enhancements for Flash/Flex sharing are another great example of recent improvements.

AIR is focusing on existing standards. Gives the ability to create an AIR application without needing to touch Flash at all, can be entirely HTML and JavaScript. The real advantage of AIR is the tight integration, like having JavaScript call Flash and vice versa. One of the key technologies included in AIR is WebKit, the same HTML rendering engine behind Safari. Better support for PDF will be included in later AIR releases.

AIR enables desktop interaction through AIR specific APIs for accessing the file system, network detection, notifications, application updates, drag and drop (with the host OS), and local databases using SQLite. More details in the AIR API Overview.

AIR support is currently only for Mac and Windows. Linux version should exist after 1.0 release. I think not having Linux out of the gate is sad, but nice to know they do have a road map which includes intended support for it.

Next up were a bunch of demos showing AIR applications. Some of them extended an existing website down to the desktop to make interaction easier and provide capabilities not available in a browser only experience.

finetune.com: Site is a combination of AJAX and Flash. AIR application extends music capabilities onto the desktop. Able to reuse most of the code. Hook into iTunes XML file to drive what music it will play. Shared profile information between website and desktop.

pownce: Micro blogging website. AIR application allows sending data by dragging and dropping it from the host OS. Website is in AJAX but they wrote the AIR application in Flex to provide additional flexible.

simple tasks: Quick AIR application thrown together using HTML and JavaScript.

buzzword: Still in private betas. Originally build in Flex as an online word processor. Created an entire text rendering engine in AS3 (possible because of the speed of AVM2). Document sharing, comments, fully WYSIWYG editing, and online/offline synchronizing.

Adobe Media Player: New way to deliver video content to users through channels.

airapps.pbwiki.com: Registry of publicly available AIR applications. People are encouraged to add links to their application.

At the upcoming MAX conference (more information below) Adobe will release Beta 2 of AIR and announce the winners of AIR Dev Derby contest. There is still time to enter the derby, deadline September 5, 2007.

If you can only make it to one conference, the MAX conference September 30 - October 3, 2007 in Chicago is highly recommended.

Tags: air flex onair2007boston

June 22, 2007

RangeError: Error #2006: The supplied index is out of bounds.

A problem I've run across a couple of times when moving a component from one parent to another is the following error:

RangeError: Error #2006: The supplied index is out of bounds.
	at flash.display::DisplayObjectContainer/getChildAt()
	at mx.core::Container/getChildAt()
	at mx.containers.utilityClasses::CanvasLayout/measure()
	at mx.containers::Canvas/mx.containers:Canvas::measure()
	(... some of stack trace deleted ...)
	at mx.core::UIComponent/mx.core:UIComponent::callLaterDispatcher2()
	at mx.core::UIComponent/mx.core:UIComponent::callLaterDispatcher()
	at [renderEvent]
	at [mouseEvent]

You'll notice that the stack trace is nothing but framework code. An error in a callLater that I didn't make? The problem is simple. When moving a component from one parent to another you have to call removeChild() on the current parent before calling addChild() to attach it to the new parent.

Continue reading "RangeError: Error #2006: The supplied index is out of bounds." »

June 21, 2007

Antennae: Ant Templates for Flex

I'm pleased to announce the release of Antennae version 1.0000. This is the first release since Antennae was migrated from Joe Berkovitz's blog up to Google Code. You can access the project at http://code.google.com/p/antennae/. This release includes a bunch of tweaks and new functionality. For those that are not familiar with Antennae it covers:

  • Macro tasks for invoking mxmlc and compc
  • Ready made templates for application projects and library projects
  • A robust system for importing and exporting assets from one project to another
  • A solid way to compose projects inside container projects
  • Dependency checking on sources and libraries to avoid unneeded recompilation
  • Handling for HTML page token substitution and web app deployment
  • Automated unit test suite generation and command line integration with Flexunit

This release is primarily aimed at getting the tools out there for public consumption. Future releases will focus on additional documentation and other ways Ant can help automate your Flex builds. Please let us know what other improvements you would like to see.

Tags: ant antennae flex

June 13, 2007

Flashforward Boston Ant Talk

I'm going to be speaking at the upcoming Flashforward Boston about Automated Flex Building and Unit Testing. The description hasn't made it up onto the site yet but is roughly something like:

A talk focusing on tools and techniques needed to get continuous integration running with a Flex project -- that is, ensuring that at any given point in time, your application is buildable and free of errors. I'll cover how to automate the build process with Ant, setting up and running unit tests both interactively from the command line, and integrating the entire process into an automated build system. All tools used are open-source and publicly available.

If there are particular topics that you'd like to see covered let me know.

Tags: ant flex

June 11, 2007

Inversion of Control in Flex

At the recent BFPUG Design Patterns Meeting I gave an overview of Inversion of Control. Unfortunately due to time constraints I wasn't able to also put together a compelling example and as such I won't be posting the lame example I did put together. Instead I'll point you to an example that demonstrates the concepts and gives you something more to play with.

The ReviewTube source contains an example of IoC. The main file to look at is "com/joeberkovitz/reviewtube/services/ReviewTubeComponents.mxml" which is pulled in from "ReviewTube.mxml".

Continue reading "Inversion of Control in Flex" »

Tags: design flex ioc

May 11, 2007

mx_internal

Sometimes you want to change the behavior of a Flex component but its hidden behind a private method or variable so you can't subclass it. Thankfully they provide the source so you can just create your own version. This is heavy handed and in some cases you just need to tweak things a little. Many components within the Flex framework have methods and properties flagged as mx_internal. These you can access without having to do anything too funky.

Continue reading "mx_internal" »

Tags: flex mx_internal namespace

May 3, 2007

Stopping Flash 4 SWF with Sound in Flex 2

I recently had an issue where in Flex 2 I had to load and play a Flash 4 SWF that had embedded sound in it. I'm not a Flash developer so I'm not 100% sure if the sound was encoded as an event or what have you. In any case as soon as the SWF was loaded it would start playing and it would loop. Since Flex 2 uses Flash 9 the Flash 4 SWF shows up as an AVM1Movie when loaded which means you can't do much of anything to the movie once it's loaded. Most annoyingly the sound keeps playing and playing.

Problem 1: How to stop the sound?
The only fix I found was to call SoundMixer.stopAll();. Drastic, but it worked.

Continue reading "Stopping Flash 4 SWF with Sound in Flex 2" »

Tags: flash flex sound

April 26, 2007

Flex 3 will be open source

The Flex world is abuzz today with the announcement from Adobe that the next version of Flex will be released as open source. While the Flex SDK already includes the source for the Flex framework components, this change will also provide the source for the compiler, debugger, and other SDK pieces. Moving forward Adobe also hopes to add community driven sub-projects and even allow people from the community to commit directly to the platform. A public bug database and repository will be part of the initial roll out with additional features being rolled out later. More information is available on the Adobe site.

March 9, 2007

Asynchronous Testing with FlexUnit

When testing components that have asynchronous behavior you need to use FlexUnit's addAsync() method in order to correctly handle the events that fire. The reason for this is that unless you tell FlexUnit that you are expecting an asynchronous event, once your test method finishes FlexUnit will assume that the test is done and there were no errors. This can lead to false positives and annoying popup error dialogs with an assert fails. Below are some examples of how to use addAsync().

I'll start off with what not to do so you can get an idea of why you need addAsync(). Let's write a simple test that verifies that the flash.utils.Timer class fires events the way we think it should. The first attempt might look like this:

Continue reading "Asynchronous Testing with FlexUnit" »

Tags: as3 flex flexunit testing

March 2, 2007

Programmatic Bindings

Recently I found myself refactoring an MXML component into an AS base class to make it easier to provide multiple views of the data. I wanted to factor as much of the code as I could into the base class including some of the bindings. While I've known for some time that Flex has programmatic binding support I'd not had a real use for it until now. The documentation is reasonable but I think I couple more examples would have helped. Below is a sample binding and the corresponding programmatic equivalent along with some gotchas.

Take an example MXML component that has a model Object set on it. The model exposes an enabled flag which the view needs to respond to in a complex fashion, beyond just disabling itself. If you want you can also replace the setter with a variable in these examples and it all works the same. It might look something like this (a bunch of code has been removed to focus just on the binding):

Continue reading "Programmatic Bindings" »

Tags: bindings flex

February 26, 2007

RegExp Constructor Issue

The Flex documentation is a a little misleading in regards to the RegExp Constructor. Livedocs has this to say:

public function RegExp(re:String, flags:String)

Lets you construct a regular expression from two strings. One string defines the pattern of the regular expression, and the other defines the flags used in the regular expression.

Notice the lack of a default value for the flags argument? One would think that would mean you should get a compilation error if you don't supply both arguments to the constructor. However, both of these compile without error:

var regExpA:RegExp = new RegExp("^http://www.google.com/(.*)$");
var regExpB:RegExp = new RegExp("^http://www.google.com/(.*)$", "");

I would expect the first one to cause this error:

1136: Incorrect number of arguments. Expected 2.

Continue reading "RegExp Constructor Issue" »

Tags: error flex regexp

January 19, 2007

Could not resolve * to a component implementation.

Often when refactoring code I'll extract ActionScript code out of an MXML file into an ActionScript based superclass to get a cleaner separation between logic and the view. In doing so I sometimes forget to update MXML variable declrations, leading to the confusing error:

Could not resolve <mx:states> to a component implementation.

Continue reading "Could not resolve * to a component implementation." »

Tags: as3 error flex2

December 23, 2006

Is Operator and Type Safe Lists

In some recent coding I was playing with a custom type system and needed to add some type checking to it. What this means is that at some point I need to verify that some object is really the type I think it should be. Normally when you are coding in AS3 and need to check a type you do something like:

Continue reading "Is Operator and Type Safe Lists" »

Tags: as3 flex list type

December 22, 2006

Static Initializers in AS3

I couldn't find much official documentation (if you have links please pass them along) about static initializers in ActionScript 3 so I thought I'd put together a little quick reference. A static initializer is run once when a class is first loaded by the AVM. The typical user of such a block is the compiler, which uses it to assign values to static variables of the class. You also can use it to do more complex static object initialization. The example that I needed it for was to create a lookup object based on constants defined in the class. Consider a class that defines some handy constants:

package com.example {
    public class MIME {
        public static const GIF_MIME_TYPE:String = "image/gif";
        public static const JPG_MIME_TYPE:String = "image/jpeg";
        public static const PNG_MIME_TYPE:String = "image/png";
        public static const SWF_MIME_TYPE:String = "application/x-shockwave-flash";
    }
}

Continue reading "Static Initializers in AS3" »

Tags: as3 flex initializer static

December 18, 2006

AS3 Casting Issues

In most object oriented languages you can cast an object to something more specific in order to be able to call methods particular to the type it was cast as. This frequently comes up when you have a rich class hierarchy and for some reason can't use polymorphism to separate out behavior or more commonly have a factory like method that needs to take in a bunch of different object types but always return the same type. Since AS3 doesn't support method overloading you can't easily separate out the different object types into specialized methods and instead end up with a big if then else block.

My issue with AS3 comes in with the fact that in such as if then else block you can't easily cast primitive objects without getting some funky behavior or without needing to wrap your cast in order to detect errors. I'm sure that there are some techniques out there to avoid this issue entirely, but having now seen it come up more than once I figured I'd jot down my observations on the issue.

Continue reading "AS3 Casting Issues" »

Tags: as3 casting flex

October 2, 2006

Singleton Pattern in AS3

AS3 does not support private or protected constructors which makes it harder to implement the singleton pattern. Below are some approaches I've run across on the Internet, problems with them, and what I hope (please tell me if I'm wrong) corrections to get a real singleton pattern working.

Continue reading "Singleton Pattern in AS3" »

Tags: as3 flex pattern singleton

September 28, 2006

AutoComplete Text Input

Adobe's Flex Team has released their first component on the Flex Exchange. It is an AutoComplete Text Input. Cool stuff.

Tags: components flex2

September 19, 2006

Fonts in Flex 2

While working on a transition recently in Flex 2 I had some issues with button text not fading along with the rest of the components. Digging into the documentation I ran across this nugget of information:

The Dissolve, Fade, and Rotate effects only work with text rendered using an embedded font. If you apply these effects to a control that uses a system font, nothing happens to the text.

Maybe this is just known but it was a surprise to me. There are other helpful font tidbits on the Using embedded fonts with effects page.

Tags: flex2 fonts

September 6, 2006

Template Method

I lead the discussion at tonight's BFPUG Pattern Meeting on the topic of the Template Method. For the discussion I put together some overview and simple examples. You can find the Flex 2 project, source, and raw Eclipse files all online.

Tags: bfpug flex pattern

August 31, 2006

Fail Fast in Eclipse?

Is there a way to make Eclipse abort the build process as soon as the first compilation bug occurs? I've been working with Flex Builder 2 for some time and one of the things that bugs me is that if a base project has an error, Eclipse still tries to compile all of the other projects which depend on it. While sometimes this helps show all of the possible errors that might appear, more often then not, I don't want to waste the time waiting for the failed build to finish. This has become especially true since adding some external Ant tasks to handle other build features that Eclipse isn't doing out of the box. I've been over the preferences but didn't see anything that made sense so if you happen to know, please pass along this nugget. Keep in mind I'm running Eclipse 3.1.2 and can't upgrade to 3.2.

Tags: eclipse programming

August 18, 2006

CSS and Runtime Modules

Another strange problem has popped up with the use of runtime modules. CSS type selectors don't work correctly. The compiler optimizes the CSS such that it only includes information for types that are actually used, based on the class dependency hierarchy. Since with a runtime module you are indirectly using classes, the dependency isn't found and the CSS information is excluded. Consider the following type selector:

SampleClass {
    backgroundColor: #FFFFFF;
    backgroundAlpha: .5;
    borderColor: #000000;
    borderThickness: 2;
    borderStyle: solid;
    paddingTop: 4;
    paddingBottom: 4;
    paddingLeft: 4;
    paddingRight: 4;
}

If you don't have a dependency on SampleClass in the main application you will end up with the following compiler warning:

"The type selector 'SampleClass' was not processed, because the type was not used in the application."

Right now I don't have a good solution for this. The simple work around is to not use a type selector but instead just make it a style selector (i.e. .sampleClass instead of SampleClass), but that requires you to set the styleName attribute on every instance you create. I'm open to other ideas.

Update
There are a couple of compiler options that help with this issue. If you are getting the warnings and don't care about them you can turn them off like this:

-show-unused-type-selector-warnings=false

This can be either a command line parameter, stuffed into a flex-config.xml file, or setup as an additional compiler argument in Flex Builder. If instead you want to include every CSS type selector, without having to do the static reference nonsense, you can do this:

-keep-all-type-selectors=true

Again that can be setup as either a command line parameter, part of a config, or enabled in Flex Builder. For additional information on the two options see LiveDocs.

Tags: css flex

August 16, 2006

Binding Warning

While working on an AS3 class today I had the following message appear in the debug console:

warning: unconverted Bindable metadata in class 'com.example::SampleData'

Everything still seemed to work correctly, but the fact that the message was getting reported concerned me. Unfortunately, this message doesn't appear in the run-time error documentation, which makes some sense since there was no error number associated with the problem and it just a warning. Doing a little more digging I found that the message is coming from the class mx.binding.BindabilityInfo.as. Thank you Adobe for including sources with the framework!

Continue reading "Binding Warning" »

Tags: actionscript3 as3 bindable flex warning

July 10, 2006

Flex 2 Runtime Error 1009 and Runtime Modules

While the following error is most often encountered when trying to access a property or function through a null object reference, it can also rear its head when working with runtime modules.

TypeError: Error #1009: Cannot access a property or method of a null object reference.
	at mx.containers::Panel/mx.containers:Panel::layoutChrome()
	at mx.core::Container/mx.core:Container::updateDisplayList()[C:\dev\GMC\sdk\frameworks\mx\core\Container.as:2910]
	at mx.containers::Panel/mx.containers:Panel::updateDisplayList()
	at mx.core::UIComponent/validateDisplayList()[C:\dev\GMC\sdk\frameworks\mx\core\UIComponent.as:5672]
	at mx.core::Container/validateDisplayList()[C:\dev\GMC\sdk\frameworks\mx\core\Container.as:2731]
	at mx.managers::LayoutManager/mx.managers:LayoutManager::validateDisplayList()[C:\dev\GMC\sdk\frameworks\mx\managers\LayoutManager.as:594]
	at mx.managers::LayoutManager/mx.managers:LayoutManager::doPhasedInstantiation()[C:\dev\GMC\sdk\frameworks\mx\managers\LayoutManager.as:646]
	at Function/http://adobe.com/AS3/2006/builtin::apply()
	at mx.core::UIComponent/mx.core:UIComponent::callLaterDispatcher2()[C:\dev\GMC\sdk\frameworks\mx\core\UIComponent.as:7789]
	at mx.core::UIComponent/mx.core:UIComponent::callLaterDispatcher()[C:\dev\GMC\sdk\frameworks\mx\core\UIComponent.as:7732]

The problem seems to be that if the runtime module makes a side-effect reference to a component, which is not included in the main application, it never really gets included in the SWF and as such causes problems when accessed. That's a jumble of words so I think an example is needed.

Continue reading "Flex 2 Runtime Error 1009 and Runtime Modules" »

Tags: actionscript as3 flex programming

July 6, 2006

Flex 2 Runtime Error 1065

Today while working on some code I started getting this error and stack trace:

ReferenceError: Error #1065: Variable LoadTest is not defined.
	at global/flash.utils::getDefinitionByName()
        at ... (rest of stack trace deleted)

Looking the error up in the documentation didn't help point the way to what might be going on since this had nothing to do with a "variable":

1065 Variable _ is not defined. You are using an undefined lexical reference. For example, in the following statements, the statement trace(x) generates an error because x is undefined. However, the statement trace(y) doesn't generate an error because y is defined: trace("hello world") trace(x) // x is undefined var y trace(y) // No error, y is defined.

Continue reading "Flex 2 Runtime Error 1065" »

Tags: actionscript as3 flex programming

June 16, 2006

Interface Constants

Since it has come up a couple of times these past two days, I'm a little disappointed that AS3 interfaces don't support constants. I guess I'm too used to Java's interfaces and really wish AS3 interfaces were as versatile. I've ended up using a class which just has static constants in it to simulate the constants that I would normally have applied to the interface.

If I'm missing some syntax or a better way around this issue, please let me know.

Tags: actionscript as3 flex interfaces

June 13, 2006

Dynamic Interface

I would like a way in AS3 to define an interface as being dynamic. In some cases I want all classes that implement an interface to also have to be dynamic. Why might this be useful? I find the chained property accessors much nicer to deal with. I'm not as concerned about adding new methods to the interface and some of the other stuff that you can do with a dynamic class, I just want easy access to unspecified attributes. The fact that you can still use the associative array style lookup on an interface to get the same result only strengthens my belief that you should be able to mark an interface as dynamic.

Since you can't apply the dynamic keyword to an interface and there doesn't seem to be a system interface that endows dynamicness on an interface, you are forced to either use looser typing or use the alternative syntax. I think this calls for an example.

Continue reading "Dynamic Interface" »

Tags: actionscript as3 flex programming

June 12, 2006

Regular Expressions

I've been playing around with Flex 2 for some time at work. One of the neat things that Actionscript 3 adds is native regular expressions. As part of an ongoing effort to share knowledge I volunteered to give an informal talk about regular expressions. To help with the talk I created this visual regular expression viewer. It helps show you what matched along with any groupings and other standard stuff. Additionally it can also perform a regular expression replace operation or a simple split operation.

You will need the Flash 9 in order to run the application.

Launch RegExp Tester!

If you find any bugs, have comments, etc. please leave me a comment.

Tags: actionscript as3 programming regexp regularexpression

June 5, 2006

Events in Flex 2

Today I got a familiar error while working with some event code:

TypeError: Error #1034: Type Coercion failed: cannot convert flash.events::Event@35f04c1 to com.neophi.events.CustomEvent.

The short answer is that this error results from failing to implement a clone() method on a custom event class. The long answer is that most of the time not implementing a clone() method won't hurt you, based on how you use your custom events, but you really should create one. In fact the Actionscript 3 (AS3) documentation is pretty clear about this:

When creating your own custom Event class, you must override the inherited Event.clone() method in order for it to duplicate the properties of your custom class.

This is a time that I wish AS3 had abstract methods.

Continue reading "Events in Flex 2" »

Tags: actionscript3 as3 events flex programming

May 6, 2006

Hacking Movable Type

While playing with the new tags feature I started with adding it to the main page of my site. The problem is that my older posts don't have any tags associated with them. The naive approach would just attach an empty "Tags: " line to each of those old posts. But even for my unskilled UI hacking skills that would be lame. There doesn't seem to be any kind of way to get the count of the number of tags associated with an entry in the Tags.app API. Doing some digging I did run across the MTIfNonEmpty template tag. I figured I could use that along with the MTTagsList widget to determine if a post had any tags.

Alas, it didn't work. Looking at the generated HTML there was a lot of excess whitespace. Thankfully I stumbled onto the trim filter. The documentation seems to indicate that the trim filter applied to the MTIfNonEmpty template tag would solve my problem.

Continue reading "Hacking Movable Type" »

Tags: movabletype mt programming tags

May 3, 2006

BFPUG Patterns Meeting

Tonight I attended the BFPUG Patterns Meeting. It was a small group of about a dozen people. The topic was the Factory pattern. An overview of the pattern and a few conceptual examples were given. Another participant and I then each gave an example of the pattern in code we are currently working on. When I got home I realized that my old roommate actually owned the copy of the Design Patterns book that I've referenced in the past. I wanted to reread the differences between the Abstract Factory Pattern and the Factory Method Pattern. Time to pick that up. Next month's pattern is tentatively the Decorator Pattern.

Tags: bfpug patterns programming

April 24, 2006

Flex 2, Actionscript 3, and E4X

I've found a feature of Actionscript 3 (AS3) that I've not seen in other languages that I think is pretty cool. It's taken me awhile to come to terms with it, but now that I've getting more comfortable with it I'm really starting to appreciate it. That feature is what is known as E4X or more officially Standard ECMA-357 ECMAScript for XML (E4X) Specification. At its core is the ability to work with and manipulate XML data in AS3 using standard language syntax instead of having to do everything through an API.

For example to create a variable that contains some hard coded XML you could just write:


var xml:XML =
<componentPackage>
<component id="MyButton" class="package1.MyButton"/>
<component id="MyOtherButton" class="package2.MyOtherButton"/>
</componentPackage>;

Continue reading "Flex 2, Actionscript 3, and E4X" »

Tags: actionscript as3 e4x flex programming xml

April 20, 2006

Pair Programming

Most of today and the later half of yesterday afternoon I spent pair programming. While I've collaborated for short periods of time with other coworkers, this is by far the first concentrated time I've spent doing it. Overall I'm inclined to believe most of what the advocates claim about pair programming. We created a lot of code and most of it worked on the first run. We didn't practice a TDD approach, but did make sure that good unit tests existed. Some of the simple issues that still came up even with two sets of eyes on the code were simple compile time errors like missing imports and changed method signatures on system APIs (the downside of working with a beta of Flex 2).

Unlike a "true" paired programming session, I didn't do much typing. I think this stemmed mostly from the fact that our development systems are laptops. It isn't as easy to slide the keyboard and mouse over to your partner in this case. Even though I wasn't doing the typing, I contributed to the code by helping spot potential issues (syntactic and strategic) while duplicating knowledge on some of the more potentially error prone plumbing of the system.

Tags: pair programming tdd work

April 8, 2006

Actionscript 3 Class.forName

I'm sure this would be obvious for anyone that has been programming in Actionscript 3 for awhile, but coming in from the Java world I'm still trying to find the matching idioms. In particular I wanted a way to dynamically load a class based on its name. In Java this is the Class.forName() construct. Luckily AS3 also has a similar mechanism:

// return the class as a Class object
var temp:Class = flash.utils.getDefinitionByName("com.example.Sample") as Class;
// you can now call new it to create an instance along with passing constructor args
var instance:Object = new temp(arg1, arg2, ...);

If when doing this you get an "Runtime Error 1065" see this post.

Note: Update Nov 6, 2007
It looks like flash.util.getClassByName() has gone away. The example above has been updated to use the new mechanism called flash.utils.getDefinitionByName().

Tags: actionscript as3 programming

April 7, 2006

Private or Helper Classes in Actionscript 3

I didn't find this well documented when I was looking it up so I thought I'd post a sample. While Actionscript 3 (AS3) doesn't support protected and private classes like Java does, you can have helper classes that are only visible within the file that they are defined. The syntax for them is a little weird but the Flex 2 Beta 2 compiler seems to like it. The syntax is that after the package you define the helper class:

package com.example {
     public class Sample {
          private var _helperClass:HelperClass = new HelperClass();
     }
}
// imports for the helper class go here
import com.example.xml.SaxHandler;
class HelperClass {
     private var _saxHandler:SaxHandler;
}

Tags: actionscript as3 programming

March 28, 2006

ActionScript

As part of my new job I've started programming in ActionScript 3. Its syntax is similar to JavaScript and is based around the upcoming ECMAScript 4 standard. The thing that has caught me off guard the most is the "variable:type" declaration syntax versus "type variable". It's only a minor thing, but I'm amazed at some of the subconscious cut'n'paste'n'edit keystrokes I have. I find this most prevalent when writing unit test code, where often you are creating similar but varied objects. The jump to home shift ctrl right keystroke doesn't help to change the type when it's after the variable.

One of those simple things that you don't really notice you are doing it until it doesn't do what you should. Joel Spolsky had a recent article taking about usability (it's a draft so I'm not going to link to it) and one quote from it was "Something is usable if it behaves exactly as expected." Right now my finger memory isn't that useful because it isn't behaving as expected. It isn't that there is anything wrong with it, as soon as I'm back in Java land it will be very helpful, but while I'm working in ActionScript it's just plan annoying :)

March 12, 2006

Metrics

While this quote comes from the recent Economist survey of wealth and philanthropy from the February 25th, 2006 issue, its applicability to software measurement can't be stressed enough:

"The risk with any metric is that people will come to see it as a description of reality, rather than a tool for a conversation about reality, says Rowena Young of the Skoll Foundation. "One metric or another can function well only when managers know why they are measuring and for whom... In the world of social value-creation, context is king." [11]

Too often software quality metrics seem to be put in place just for the sake of having metrics instead of using them in a beneficial way. As a result people game the system and work towards the metric instead of focusing on quality. If as noted people instead used metrics as a stepping stone to talk about the state of a project and only used metrics that had a clear benefit in such discussions, I think a lot of wasted effort could be eliminated.

January 25, 2006

Making the Date

I recently ran across an article about some of the problems with how management views a development team and how that can lead to problems. The article goes on to talk about the tradeoffs between time, resources, and features that usually result in a failed project. The crux is that management needs to manage the development team with the understanding that only so much can ever get done and that good management will realize this and adjust the project goals along the way to ensure that it succeeds.

January 17, 2006

Why Software Fails

Digging through old email I ran across an article a former coworker recommended to me. The article
Why Software Fails is a great read. To me it speaks of hubris on a scale I find hard to match in almost any other profession. As the article points out we mostly know what is wrong and how to fix it, yet the advice is continually ignored and projects continue to fail.

Being a professional software developer I struggle with this dilemma. I've ignored best practices, I've been asked to cut corners, I've made buggy code that could have been avoided had I used best practices or not cut corners. The fact that software has not suffered the litigation onslaught found in other industries or professions I believe only perpetuates the current state of affairs. However, like the article points out there is rarely if ever a single cause of problems and the list of twelve mentioned is only the tip of the iceberg.

Continue reading "Why Software Fails" »

January 3, 2006

object/embed and Browser Based WYSIWYG HTML Editors

One problem I've run across with browser based WYSIWYG HTML editors is that they don't handle fallback HTML well. This problem is most evident when switching between the WYSIWYG view and the source view for an HTML document. I've primarily seen this issue with Internet Explorer when trying to include an object tag. In typical fallback fashion you include the embed tag within the object tag. The problem is when you then switch from source to WYSIWYG and then back to source, IE's internal DOM throws out the embed. The net result, a document that can only be edited in source view or a document that only works in Internet Explorer.

Granted maybe adding an object/embed tag through a WYSIWYG editor isn't the smartest thing, but the fact that information is being lost along the way doesn't give much credence to Microsoft's push for round-tripping. Maybe someone has solved this, but as best as I've been able to tell both FCKeditor and HTMLArea suffer from this problem.

January 2, 2006

Agile Development and TDD

While trying to clean out my inbox today I ran across an old article from Scott W. Ambler about things he overhead at the Agile 2005 conference. In particular the section on Test Driven Development is worth repeating:

FOUR TEST-DRIVEN DEVELOPMENT COMMANDMENTS 1. When you write tests last, the tests are bigger because they take poor design issues into account. When you write them first, you typically end up with well-designed, loosely coupled code. 2. Maximum safety comes from having zero or one failing tests at a time. 3. With tests in place, you can come back to the project months later and pick it up quickly because you have solid ground to work from. 4. If you write tests afterward, you sometimes discover that your code isn't testable.

Everything about test driven development just makes sense. I really need to get into the habit of doing it more.

December 20, 2005

Hibernate, Oracle, Named Query, and Null

I'm sure this is captured in a bunch of FAQs but I thought I'd mention it here so I at least have an easy place to find it in the future. If you have a named query with parameters in Hibernate at some point you will probably run across this error:

Hibernate operation: could not execute query; bad SQL grammar [select table0_.id as id, table0_.version_stamp as version3_90_, table0_.user_id as user4_90_, table0_.confirmed as confirmed90_ from example_table table0_ where table0_.user_id=?]; nested exception is java.sql.SQLException: ORA-00932: inconsistent datatypes: expected NUMBER got BINARY

While the error looks nasty, the most likely cause is that you accidentally passed in a Java null value instead of the expected type. In this case it should have been a Java Long value.

December 6, 2005

Eclipse, SVN, Subclipse, and case sensitivity

I don't know what it was about today, but I did something different when setting up a new workspace in Eclipse. We recently branched our code to work on a new feature for the site. I did my usual trick of copying my "Tip of the Tree" Eclipse workspace to a new directory and renaming it. I then launched Eclipse with the new workspace, deleted all of the old projects, and lastly imported the projects for the newly branched code. The problem was this time all of the nice Subclipse icons didn't show up. After repeating this process a couple of times, it finally dawned on me to check the Eclipse .log. It had this lovely message in it:

Provided SVN information does not match that on disk for project

A quick Google search didn't turn up anything helpful. Needless to say after a couple hours of banging of head against the desk I found the problem. Some combination of Eclipse, SVN, and Subclipse was case sensitive. I was saving time when importing the projects and just trying in the path, turns out even on Windows "c:\source\" is different than "c:\Source". The lesson in all of this is to only use the directory browser when selecting projects to import, otherwise the case may haunt you.

Continue reading "Eclipse, SVN, Subclipse, and case sensitivity" »

October 11, 2005

HttpUnit and document.referrer

Another small patch to HttpUnit 1.6.1 to go along with my other one. The following JavaScript blows up in HttpUnit, but runs fine in a normal browser:

var temp = document.referrer;
if (temp.length <= 1) {
temp = "no referrer"
}

The resulting stack trace is below. The fix is to add the following method to the Document nested class in HttpUnit's JavaScript class.

public String jsGet_referrer() throws SAXException {
return "";
}

You could stub that method out with something more interesting, but that's good enough for me at this time.

Continue reading "HttpUnit and document.referrer" »

October 10, 2005

HTTPS testing with jWebUnit

A common problem with testing HTTPS is having to deal with self-signed certificates. While Java has made it pretty easy to add certificates to your local keystore, for development purposes it always seemed like more trouble than it was worth. While some of the standard solutions worked well in the past, trying to use jWebUnit which builds upon HttpUnit resurfaced many of the same issues. It seems HttpUnit knows best and forces using the old school Sun SSL provider in com.meterware.httpunit.HttpsProtocolSupport. As a result the typical Trust All Certificates hack doesn't work. To complicate matters connecting to localhost, 127.0.0.1, and whatever other name your machine might have, can cause validation issues. This can be worked around with a custom HostnameVerifier. Alas, again HttpUnit makes it hard to get around that problem too.

Continue reading "HTTPS testing with jWebUnit" »

BeanShell and finally

Trying to use BeanShell 2.0b4 to allow on-the-fly database driven Java interface implementations I was getting an odd error when trying to call a method on the interface. There weren't any errors instantiating the interface only when I called the method. The error was something like:

Caused by: Incorrect type returned from method: validate
Can't assign void value to com.neophi.ValidateResult:
Can't assign void value to com.neophi.ValidateResult:
at Line: -1 : in file: <Called from Java Code> : <Compiled Java Code>

The root cause was that the version of BeanShell being used doesn't fully support all Java constructs. In particular this sample code will cause the above error:

public ValidateResult validate(String email, String password)
{
try {
return new ValidateResult();
} finally {
// something that must always happen
}
}

In order to work in BeanShell the method must be rewritten as such:

public ValidateResult validate(String email, String password)
{
ValidateResult validationResult = null;
try {
validationResult = new ValidateResult();
} finally {
// something that must always happen
}
return validationResult;
}

Hopefully this will spare someone else from getting a headache.

HttpUnit and JavaScript

A little problem I worked through with HttpUnit and the Rhino JavaScript library while writing some automated tests.

Using the stock httpunit-1.6.1 with js-1.5R4.1.jar (the version of js.jar included in the httpunit-1.6.1 jars directory) I ran into an issue testing a site that included some fairly standard JavaScript code:

if (navigator.plugins && navigator.plugins.length) {
// do something that requires a plugin
}

The above code produces a nasty stack trace something along the lines of:

org.mozilla.javascript.EvaluatorException: Invalid JavaScript value of type [Ljava.lang.Object; (httpunit; line 41)
at org.mozilla.javascript.DefaultErrorReporter.runtimeError(DefaultErrorReporter.java:76)
at org.mozilla.javascript.Context.reportRuntimeError(Context.java:591)
at org.mozilla.javascript.Context.reportRuntimeError(Context.java:630)
at org.mozilla.javascript.Context.reportRuntimeError1(Context.java:606)
at org.mozilla.javascript.ScriptRuntime.errorWithClassName(ScriptRuntime.java:2058)
at org.mozilla.javascript.ScriptRuntime.toBoolean(ScriptRuntime.java:119)
at org.mozilla.javascript.gen.c18.call(httpunit:41)
at org.mozilla.javascript.gen.c18.exec(httpunit)
at org.mozilla.javascript.Context.evaluateReader(Context.java:820)
at org.mozilla.javascript.Context.evaluateString(Context.java:784)
at com.meterware.httpunit.javascript.JavaScript$JavaScriptEngine.executeScript(JavaScript.java:132)
at com.meterware.httpunit.scripting.ScriptableDelegate.runScript(ScriptableDelegate.java:65)
at com.meterware.httpunit.ParsedHTML.interpretScriptElement(ParsedHTML.java:325)
at com.meterware.httpunit.ParsedHTML.access$700(ParsedHTML.java:37)
at com.meterware.httpunit.ParsedHTML$ScriptFactory.recordElement(ParsedHTML.java:489)
at com.meterware.httpunit.ParsedHTML$2.processElement(ParsedHTML.java:706)
at com.meterware.httpunit.NodeUtils$PreOrderTraversal.perform(NodeUtils.java:195)
at com.meterware.httpunit.ParsedHTML.loadElements(ParsedHTML.java:722)
at com.meterware.httpunit.ParsedHTML.getFrames(ParsedHTML.java:1034)
at com.meterware.httpunit.WebResponse.getFrames(WebResponse.java:1098)
at com.meterware.httpunit.WebResponse.getFrameRequests(WebResponse.java:875)
at com.meterware.httpunit.FrameHolder.updateFrames(FrameHolder.java:179)
at com.meterware.httpunit.WebWindow.updateFrameContents(WebWindow.java:252)
at com.meterware.httpunit.WebClient.updateFrameContents(WebClient.java:485)
at com.meterware.httpunit.WebWindow.updateWindow(WebWindow.java:146)
at com.meterware.httpunit.WebWindow.getSubframeResponse(WebWindow.java:130)
at com.meterware.httpunit.WebWindow.getResponse(WebWindow.java:121)
at com.meterware.httpunit.WebWindow.updateWindow(WebWindow.java:144)
at com.meterware.httpunit.WebWindow.getSubframeResponse(WebWindow.java:130)
at com.meterware.httpunit.WebWindow.getResponse(WebWindow.java:121)
at com.meterware.httpunit.WebClient.getResponse(WebClient.java:113)
(... additional lines deleted ...)

Continue reading "HttpUnit and JavaScript" »